offset

In all browsers it’s necessary to use the offsetTop and  offsetLeft of the element. These properties give the coordinates of the element. Of course the question is: coordinates relative to what?

The answer is: relative to the offsetParent. Although the browsers have sharp disagreements on the identity of the offsetParent, we do not really need to know, since the offsetParent property always contains a reference to the correct HTML element.For instance, Mozilla nearly always gives the offset of an element relative to the entire page, while Opera always gives the offset relative to the containing HTML element. So if you ask for the offsetTop of a link in a P, Mozilla gives the offset relative to the HTML element (= the entire page), while Opera gives the offset relative to the containing P.However, in all browsers the offsetParent property contains a reference to this element: in Mozilla to the HTML element, in Opera to the P element. Therefore the only thing we need to do is to continue calculating the offset as long as there is an offsetParent. In Mozilla we calculate the offset relative to the HTML element and then stop, since the HTML element doesn’t have an offsetParent, while in Opera we continue to go up the entire tree: P, BODY and finally HTML. If we add all offsets we have found, in the end we get the correct position in all browsers.

So you don’t need to know the details of the calculation, just continue up the offsetParent tree as long as it exists, and in the end you will have found the true position of the element on the screen.