CODEWITHSUNDEEP
javascriptjquery
akshat
akshat

Reputation: 15892

How do I find the absolute position of an element using jQuery?

Is there a way of finding the absolute position of an element, i.e. relative to the start of the window, using jQuery?

Upvotes: 434

Views: 405743

Answers (3)

Flo
Flo

Reputation: 487

In case the element is not visible $(element).offset(); and $(element).position(); retun 0 for both top and left instead of the elements real value.

i had to use

parseInt($(element).css("top"))
parseInt($(element).css("left"))

to return the needed information. the element has position: absolute;.

Upvotes: 0

Tom Auger
Tom Auger

Reputation: 20066

Note that $(element).offset() tells you the position of an element relative to the document. This works great in most circumstances, but in the case of position:fixed you can get unexpected results.

If your document is longer than the viewport and you have scrolled vertically toward the bottom of the document, then your position:fixed element's offset() value will be greater than the expected value by the amount you have scrolled.

If you are looking for a value relative to the viewport (window), rather than the document on a position:fixed element, you can subtract the document's scrollTop() value from the fixed element's offset().top value. Example: $("#el").offset().top - $(document).scrollTop()

If the position:fixed element's offset parent is the document, you want to read parseInt($.css('top')) instead.

Upvotes: 221

Crescent Fresh
Crescent Fresh

Reputation: 116980

.offset() will return the offset position of an element as a simple object, eg:

var position = $(element).offset(); // position = { left: 42, top: 567 }

You can use this return value to position other elements at the same spot:

$(anotherElement).css(position)

Upvotes: 701

Related Questions