Getboundingclientrect () method. It returns an object that contains the left, right, top, and bottom four properties that correspond to the distance between the top and bottom corners of the element relative to the upper-left corner of the browser window (viewport).
The generic gain element is relative to the viewport function, which traverses the parent element upward (because some browsers do not support the Getboundingclientrect method):
function Getelementleft (Element) {
var actualleft = Element.offsetleft;
var current = Element.offsetparent;
while (current!== null) {
Actualleft + = Current.offsetleft;
current = Current.offsetparent;
}
return actualleft;
}
function Getelementtop (Element) {
var actualtop = element.offsettop;
var current = Element.offsetparent;
while (current!== null) {
Actualtop + = Current.offsettop;
current = Current.offsetparent;
}
return actualtop;
}
function Getboundingclientrect (Element) {
var scrolltop = Document.documentElement.scrollTop;
var scrollleft = Document.documentElement.scrollLeft;
if (element.getboundingclientrect) {
if (typeof Arguments.callee.offset! = "number") {//fix IE8 and previous version from (2,2) coordinates start calculation
var temp = document.createelement ("div");
Temp.style.cssText = "position:absolute;left:0;top:0;";
Document.body.appendChild (temp);
Arguments.callee.offset =-temp.getboundingclientrect (). Top-scrolltop;
Document.body.removeChild (temp);
temp = null;
}
var rect = Element.getboundingclientrect ();
var offset = Arguments.callee.offset;
return {
Left:rect.left + offset,
Right:rect.right + offset,
Top:rect.top + offset,
Bottom:rect.bottom + Offset
};
} else {//for repairs that do not support getboundingclientrect
var actualleft = Getelementleft (Element);
var actualtop = getelementtop (Element);
return {
Left:actualleft-scrollleft,
Right:actualleft + Element.offsetwidth-scrollleft,
Top:actualtop-scrolltop,
Bottom:actualtop + element.offsetheight-scrolltop
}
}
}
Because Arguments.callee is used, it is not used in strict mode.
Scrollwidth,clientwidth,offsetwiddth,innerwinth element Positioning