JavaScript gets the browser height and width values (documentelement,clientheight,offsetheight,scrollheight,scrolltop,offsetparent,offsety, Innerheight)

In IE:

Document.body.clientWidth ==> Body Object width

Document.body.clientHeight ==> Body Object Height

Document.documentElement.clientWidth ==> Visible Area width

Document.documentElement.clientHeight ==> Visible Area height

In Firefox:

Document.body.clientWidth ==> Body Object width

Document.body.clientHeight ==> Body Object Height

Document.documentElement.clientWidth ==> Visible Area width

Document.documentElement.clientHeight ==> Visible Area height

In Opera:

Document.body.clientWidth ==> Visible Area width

Document.body.clientHeight ==> Visible Area height

Document.documentElement.clientWidth ==> The width of the page object (that is, the body object width plus the margin width)

Document.documentElement.clientHeight ==> Page Object height (i.e. body object height plus margin height)

There is no standard for defining the

IE is:

Document.documentElement.clientWidth ==> 0

Document.documentElement.clientHeight ==> 0

Firefox is:

Document.documentElement.clientWidth ==> The width of the page object (that is, the body object width plus the margin width)

Document.documentElement.clientHeight ==> Page Object height (i.e. body object height plus margin height)

Opera is:

Document.documentElement.clientWidth ==> The width of the page object (that is, the body object width plus the margin width)

Document.documentElement.clientHeight ==> Page Object height (i.e. body object height plus margin height)

Web page Visible area width: document.body.clientWidth
Web page Visible Area height: document.body.clientHeight
Web page Visible Area width: document.body.offsetWidth (including edge width)
Web page Visible Area High: document.body.offsetHeight (including edge height)
Page body Full text width: document.body.scrollWidth
Page body Full text High: Document.body.scrollHeight
Page is rolled away High: document.body.scrollTop
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 work area height: window.screen.availHeight
Screen available work area width: window.screen.availWidth

(Note: The margin attribute in CSS has nothing to do with ClientWidth, offsetwidth, ClientHeight, offsetheight)

HTML precise positioning: ScrollLeft, ScrollWidth, ClientWidth, offsetwidth

ScrollWidth ==> Gets the scrolling width of the object
ScrollHeight ==> Gets the scroll height of the object
ScrollLeft ==> Sets or gets the distance between the left edge of the object and the leftmost of the currently visible content in the window ( left to be rolled )
ScrollTop ==> Sets or gets the distance between the top of the object and the top of the visible content in the window (the height being rolled away )
Offsetleft ==> Gets the calculated left position of the object relative to the layout or the parent coordinate specified by the OffsetParent property
OffsetTop ==> gets the calculated top position of the object relative to the layout or parent coordinates specified by the OffsetTop property
Offsetheight ==> Gets the height of the object relative to the layout or parent coordinates specified by the parent coordinate OffsetParent property

Event.clientx horizontal coordinates of ==> relative documents

Event.clienty ==> Vertical coordinates of relative documents

Event.offsetx ==> relative to the container's horizontal coordinates

Event.offsety ==> The vertical coordinate of the relative container

Document.documentElement.scrollTop ==> Vertical Scrolling value

Event.clientx+document.documentelement.scrolltop ==> Horizontal coordinates of relative documents + amount of vertical scrolling

Implementation code:

<! DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 transitional//en" "Http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd ">
  attached HTML test code:  
 
<! DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 transitional//en" "Http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd ">
Summary
Browser viewport height function windowheight () {var myheight = 0;    if (typeof (window.innerheight) = = ' number ') {//non-ie myheight = window.innerheight; } else if (Document.documentelement && (document.documentElement.clientHeight)) {//ie 6+ in ' standards com    pliant mode ' myheight = document.documentElement.clientHeight; } else if (Document.body && (document.body.clientHeight)) {//ie 4 compatible myheight = Document.bo    Dy.clientheight; } return myheight;}    Browser viewport width function windowwidth () {var mywidth = 0;    if (typeof (window.innerwidth) = = ' number ') {//non-ie mywidth = window.innerwidth; } else if (Document.documentelement && (document.documentElement.clientWidth)) {//ie 6+ in ' standards Comp    Liant mode ' mywidth = document.documentElement.clientWidth; } else if (Document.body && (document.body.clientWidth)) {//ie 4 compatible mywidth = DocumeNt.body.clientWidth; } return mywidth;}    /**** Browser vertical scroll position ****/function scrolly () {var de = document.documentelement; return Window.pageyoffset | | (de && de.scrolltop) | | Document.body.scrollTop;}    /**** Browser horizontal scrolling position ****/function scrollx () {var de = document.documentelement; return Window.pagexoffset | | (de && de.scrollleft) | | Document.body.scrollLeft;} /**** Current Page height ****/function pageheight () {return document.body.scrollHeight;} /**** Current page width ****/function pagewidth () {return document.body.scrollWidth;}
 JavaScript Gets the browser height and width values (documentelement,clientheight,offsetheight,scrollheight,scrolltop,offsetparent,offsety , Innerheight)