geting the absolute position of an element in jquery

Question

I have a series of elements setup like the example below:

<div id="floater"></div>

<div id="alert"></div> <div id="news"></div> <div id="links"></div>

When a link in the links div is clicked I used jQuery to animate the floater div to its position so as the user can easily reference the last link they clicked.

However. alert is setup to fade out and vanish onClick and news is setup with a toggle so that it accordions in and out of view.

Depending on the state of alert and news the floater will animate to an incorrect position.

Is there a way to get the actual true current position of an element in jQuery other than offset() or position()?

Answer 1

You can use the pageX/pageY attributes of the element.

Answer 2

You can also use the native offset values:

//pure js

element.offsetLeft
element.offsetTop
element.offsetWidth
element.offsetWidth

//jquery

$(element).attr('offsetLeft');
$(element)[0].offsetLeft;
$(element).get(0).offsetLeft;