How do I calculate an elements position in a scrolled div?

Question

I have a div with absolute positioning set to allow vertical scrolling. My app includes drag & drop facilities that rely on me determining the coordinates of elements when events are fired.

The offsets I use to calculate elements positions (i.e. element.offsetLeft & element.offsetTop) only relate to original position of the element and do not account for changes in position that result from the user having scrolled. I figured I could add in a correction if I could calculate the distance scrolled but I can't see any way to do that (unlike with window scrolling).

Would really appreciate any suggestions.

Answer 1

Take a look at the scrollTop and scrollLeft properties of the div container.

Answer 2

This is what I'm implementing as a correction in case anyone's interested.

Thanks guys.

/* Find a html element's position. Adapted from Peter-Paul Koch of QuirksMode at http://www.quirksmode.org/js/findpos.html */ function findPos(obj) { var curleft = 0; var curtop = 0; var curxscroll = 0; var curyscroll =0;

while(obj && obj.offsetParent)
{
 curyscroll = obj.offsetParent.scrollTop || 0;
 curxscroll = obj.offsetParent.scrollLeft || 0;
 curleft += obj.offsetLeft - curxscroll;
 curtop += obj.offsetTop - curyscroll;
 obj = obj.offsetParent;
}

return [curleft,curtop];

}