position() calculates positioning relative to the offset parent — or, in
more understandable terms, the nearest parent or ancestor of this element
that has position: relative. If no such parent or ancestor is found,
the position is calculated relative to the document (i.e. the top-left corner
of the viewport).
offset(), in contrast, always calculates positioning relative to the
document, regardless of the position attribute of the elements’ parents
and ancestors.
Consider the following two
s:
Querying (no pun intended) the offset() and position() of
#innerDiv will return different results.
1 var position = $('#innerDiv').position();
2 var offset = $('#innerDiv').offset();
3 alert("Position: left = "+position.left+", top = "+position.top
+"\n"+(^4) "Offset: left = "+offset.left+" and top = "+offset.top
5 )