Home > Developer > Web Develop
<!DOCTYPE HTML><HTML> <Head> <MetaCharSet= "UTF-8"> <title></title> </Head> <Body> <Ponclick=getelementrect (This)>How are you doing</P> <Ponclick=getelementrect (This)>How are you doing</P> <Ponclick=getelementrect (This)>How are you doing</P> <TableBorder= "1"cellspacing=""cellpadding=""> <TR><thonclick=getelementrect (This)>Header</th></TR> <TR><TD>Data</TD></TR> <TR><TD>Data</TD></TR> </Table> </Body></HTML><Script> /** * scroll bar position * @param {Object} w*/ functionGetscrolloffsets (w) {W=W||window; //in addition to IE 8 and earlier versions, other browsers support if(W.pagexoffset!= NULL){ return{X:w.pagexoffset,y:w.pageyoffset}; } /** * Document.compatmode is used to determine the rendering method used by the current browser. * Backcompat: Standard compatibility mode is off. * Css1compat: Standard compatibility mode is turned on. * When Document.compatmode equals Backcompat, the browser client area width is document.body.clientWidth; scroll bar position Document.body.scrollLeft * When document When the. Compatmode equals Css1compat, the browser client area width is document.documentElement.clientWidth; scroll bar position Document.documentElement.scrollLeft*/ varD=w.document; if(Document.compatmode== "Css1compat"){ return{x:d.documentelement.scrollleft,y:d.documentelement.scrolltop}; }Else{ return{x:d.body.scrollleft,y:d.body.scrolltop}; } } //returns the dimensions of the viewport as the W and H properties of an object functionGetviewportsize (w) {//Use the specified window if the current window is used without parametersW=W||window; //in addition to IE8 and earlier versions, other browsers are available if(W.innerwidth!= NULL){ return{w:w.innerwidth, h:w.innerheight}; } //IE (or any browser) in standard mode varD=w.document; if(Document.compatmode== "Css1compat"){ return{w:d.documentelement.clientwidth, h:d.documentelement.clientheight}; }Else{ return{w:d.body.clientwidth, h:d.body.clientheight}; } } /** * This method returns the position of the element in viewport coordinates. In order to convert the document coordinates to even the user scrolling the browser window to the successor, it is necessary to add the scroll offset: * Getboundingclientrect () method. This method was introduced in IE5, and now all of the current browsers are implemented. It does not require parameters to return the object of the left, right, top, bottom properties. * @param {Object} e*/ functionGetelementrect (e) {varBox=E.getboundingclientrect (); varOffsets=getscrolloffsets (); varx=Box.left+offsets.x; vary=Box.top+Offsets.y; varW=Box.width||Box.right-Box.left; varh=Box.height||Box.bottom-Box.top; Console.log ({x:x, y:y, W:w, h:h})return{x:x, y:y, W:w, h:h}; }</Script>
HTML positioning (scroll bar, element, viewport) positioning
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
