Distance between an element and the top of the page

[Gilles Lenfant]

Hi,

I got an element ( say <div id="foo">... ) at its natural position in a
page.
I need to get the distance (in pixels) between the top of that element and
the top of the page/frame.
Of course, I'd prefer this to work with IE and Mozilla family.

Many thanks in advance.

--Gilles

[Martin Honnen]

Gilles Lenfant wrote:

Hi,

I got an element ( say <div id="foo">... ) at its natural position in a
page.
I need to get the distance (in pixels) between the top of that element and
the top of the page/frame.
Of course, I'd prefer this to work with IE and Mozilla family.

With Netscape 6+, IE4+ and (at least) Opera 6+ any element object has
properties
offsetLeft
offsetTop
offsetParent
where the first two give you the coordinates relative to the last, the
offsetParent. If you add offsetLeft/offsetTop along the offsetParent
hierarchy you get the page coordinates of the element:
function getPageCoords (element) {
var coords = { x: 0, y: 0};
while (element) {
coords.x += element.offsetL eft;
coords.y += element.offsetT op;
element = element.offsetP arent;
}
return coords;
}
function getElementObjec t (elementId) {
if (document.all)
return document.all[elementId];
else if (document.getEl ementById)
return document.getEle mentById(elemen tId);
else
return null;
}
var coords = getPageCoords(g etElementObject ('elementId'));
alert(coords.x + ':' + coords.y)
Make sure you call getPageCoords after the page has been loaded

--

Martin Honnen
http://JavaScript.FAQTs.com/