.offset() returns an element's left and top *relative to the body*. .position() returns an element's left and top *relative to its offsetParent* .
The offsetParent of an element is its nearest parent that defines a local coordinate system. For example if you have an element with position:relative, that makes it the offsetParent for any child elements. Suppose you want to take an element on its page and get its coordinates so you can create another element of the same size and visual location, absolutely positioned and with a higher z-index so it covers up the original element. What do you use for the left and top for your new element? Case 1: You want to create your new element as a sibling of the original element. Use the original element's .position(). Case 2: You want to create this new element as an immediate child of the document body. Use the original element's .offset(). The document body is the default offsetParent if there isn't another one, and in that case .offset() and .position() should return the same values (I think - a quick test seemed to confirm this). -Mike On Wed, Sep 9, 2009 at 9:22 AM, Mike McNally <emmecin...@gmail.com> wrote: > > By the way - the documentation doesn't do much of a job at explaining > the difference between the "offset()" and "position()" routines, and I > have a feeling that some of what is written there may not be 100% > accurate. I find that I generally use "position()" instead of > "offset()", but that's only based on empirical trials and not a real > understanding of what those routines are and what they're for. >
