Determining an element's absolute on-document position
I need to determine the exact on-screen coordinates (relative to document) of an HTML element.
I already have code that does this (summing clientWidth and clientHeight of each parent object up to the root), but seemed to be ineffective when jQuery's scroll effect comes into work.
The elements I need to detect the position of, in fact, are part of a div
with overflow="hidden"
that i开发者_JAVA技巧s used for jQuery scrolling effect.
When I try to get the element's position with the current code, I get a width value that is relative to the length of the scrollable panel. When I scroll the panel, the position remains the same (so, the tooltip I ultimately need to position is placed too right, in the exact position the anchor control is when hidden behind the container panel's overflow.
My question is
How to adapt the current code to this requirement?
function findPos(obj) {
var curleft = curtop = 0;
if (obj.offsetParent) {
do {
curleft += obj.offsetLeft;
curtop += obj.offsetTop;
} while (obj = obj.offsetParent);
}
return [curleft, curtop];
}
Use jQuery's .offset()
function.
As Matt points out, its wise to use a Frameworks function for that, because it is cross-browser compatible and fixes various issues through different versions.
Besides that, i hope you refer to "screen" as the currend shown document in your browser and not the actual computer-screen/display, because that would quite impossible.
精彩评论