CODEWITHSUNDEEP
jqueryhtmlcss
Gabe
Gabe

Reputation: 50493

How to avoid decimal values for offset().left

I am building a flyout menu using <ul>'s.

Example:

<ul class="uiMenu">
    <li>One
        <ul>
           <li>Test Child</li>
        </ul>
    </li>
    <li>Two
         <ul>
           <li>Test Child 2</li>
        </ul>
    </li>
    <li>Three</li>
</ul>

So the flyout for the menu's left offset should be the offset of the parent menu item's left offset.

When I iterate thru each parent <li> I notice the offset's are decimal values. But in older versions of IE they are not, just for simplicity I would like to avoid decimal offsets.

Any idea to make sure the offset values end up being integers?

Example

Upvotes: 1

Views: 1940

Answers (5)

Mandeep Pasbola
Mandeep Pasbola

Reputation: 2639

Use

$(document).ready(function(){

$('.uiMenu > li').each(function(){

    console.log('offset().left: ' + parseInt($(this).offset().left));
});

});

Upvotes: 0

Umesh Patil
Umesh Patil

Reputation: 10685

It iterates all the LI elements inside 'uiMenu'. For better and non-conflicting code. Provide IDs to top title lis.

<ul class="uiMenu">
    <li class="title">One
        <ul>
           <li>Test Child</li>
        </ul>
    </li>
    <li class="title">Two
         <ul>
           <li>Test Child 2</li>
        </ul>
    </li>
    <li class="title">Three</li>
</ul>

Do coding by selecting the .title 

  $('.title ').each(function(){
          console.log('offset().left: ' + $(this).offset().left);
        });

Upvotes: -1

rejj
rejj

Reputation: 1216

A neat javascript trick is that a shift-left by zero places will truncate any decimal places, in effect doing the same as Math.floor() eg,

/* this == 1 */
1.3 << 0;
/* also == 1 */
1.8 << 0;

Note however, this isonly of any benefit in the tightest of loops - if you suspect a function table lookup for Math.floor() and stack push/pops are actually costing you time.

Just putting it here for reference. using Math.round() or Math.floor() is going to be the more correct answer for your problem, due to it being much more readable.

Upvotes: 0

Joseph Silber
Joseph Silber

Reputation: 219938

Just round/floor it with Math.round()/Math.floor():

Math.round($(this).offset().left);

Upvotes: 6

Robert Wilson
Robert Wilson

Reputation: 669

You can use the parseInt(offsetValue) method. This rounds a decimal.

Upvotes: 0

Related Questions