Common coordinate properties in JavaScript offset, scroll, client

1. In Document Object：

scrollwidth/height: Gets the scrolling width of the object (the width of the scroll bar can be scrolled, which is equivalent to the total width of the entire page--full width of the page body)

scrollleft/top: Sets or gets the distance between the leftmost edge of the object's left border and the currently visible content in the window (when the page scrolls to the right with the scroll bar, the width of the page that is hidden on the left side of the scrollbar---page is rolled to the left)

  2, in the Node object with:   Offsetleft/top: Gets the object relative to the layout (the CSS does not have a location, the OffsetParent value is computed for the root element) or the left position of the calculated parent coordinate specified by the OffsetParent property (when CSS is positioned, The distance from the current object relative to the offsetparent element) Offsetwidth/height ( Width+padding+border)Gets the width of the current object. Style.width is also the width of the current object (Width+padding+border). Difference: 1) style.width return value in addition to the number of units px; 2) If the width of the object is set to a percentage width, the style.width returns this percentage regardless of whether the page is larger or smaller, and offsetwidth returns the width value of the object in different pages without is the percent value; 3) If the width style is not specified for the HTML element, Style.width returns an empty string; offsetleft:The distance from the current object to the left of its parent layer. It cannot be assigned a value. Set the distance to the left of the upper layer of the object, using the Style.left property. Style.left the distance from the current object to the left of its parent layer. Difference: 1) Style.left return value in addition to the number of units px; 2) If the distance set to the left of the object to its upper level is a percentage, Style.left returns this percentage, and Offsetleft returns the value of the distance to the left of its parent layer; 3) If the left style is not specified for the HTML element, then Style.left returns an empty string; Note: If the upper layer is the body, because IE, ff to padding, margin interpretation is not the same, so it should be clear that the treatment is not the following differences are not established.       IE 1) If the upper layer of div is body, and there is a div between the div and the body, such as Body->div->divo;divo's Offsettop=div padding+margin+boder; 2) If the upper layer of div is body, such as Body>divo;divo's Offsettop=div padding+margin+boder; this divo offsettop=divo margin >body.p Adding is the margin of Divo, otherwise body.padding who is big? FF The above two cases: offsettop=margin+padding;(IE and FF in the body default padding is 10) in IE6.0 FF3.6.13 Clientwidth/height:Gets the width of the object's visible content, excluding scroll bars, excluding borders;   Clientleft/top:Gets the border width of the object   3. Used in the event：

Event.clientx horizontal coordinates of relative documents

Event.clienty vertical coordinates of relative documents

Event.offsetx the horizontal coordinate of the relative container event.offsety the vertical coordinate of the relative container 4, the screen:Window.screentop page Body Part Window.screenlfet page body part left Window.screen.height screen resolution law of high Window.screen.left screen resolution law wide Window.screen.availHeight the height of the available workspaces for the screen window.screen.availWidth the width of the available workspaces for the screen Document.documentElement.scrollTo P Vertical Scrolling Value page visible area width: document.body.clientWidth; page visible Area High: document.body.clientHeight;
Web page Visible Area width: document.body.offsetWidth (including the width of the edge);
Web page Visible Area High: document.body.offsetHeight (including the width of the edge);
Page body Full text width: document.body.scrollWidth;
Page body Full text High: document.body.scrollHeight;
The page was rolled High: document.body.scrollTop;
The webpage is rolled away left: document.body.scrollLeft;
Page body part: window.screentop;
Page body part left: window.screenleft;
High screen resolution: window.screen.height;
Width of screen resolution: Window.screen.width;
Screen available working area height: window.screen.availHeight;
Screen available working area width: window.screen.availWidth;

Common coordinate properties in JavaScript offset, scroll, client