JS Gets the height of the window scrollbar, the height of the window's visible range, the actual content height of the document, the height of the scroll bar from the bottom of the browser

1. Get the height of the window's visible range

1 //gets the height of the window's visible range2 functiongetclientheight () {3     varClientheight=0; 4     if(document.body.clientheight&&document.documentElement.clientHeight) {  5         varclientheight= (document.body.clientheight<document.documentelement.clientheight)?Document.body.clientHeight:document.documentElement.clientHeight;6}Else{  7         varclientheight= (document.body.clientheight>document.documentelement.clientheight)?Document.body.clientHeight:document.documentElement.clientHeight;8     }  9     returnclientheight; Ten}

2. Get the height of the window scroll bar

1 functionGetscrolltop () {2     varScrolltop=0; 3     if(document.documentelement&&Document.documentElement.scrollTop) {  4scrolltop=Document.documentElement.scrollTop; 5}Else if(document.body) {6scrolltop=Document.body.scrollTop; 7     }  8     returnscrolltop; 9}

3. Get the actual height of the document content

1 function getscrollheight () {  2     return  Math.max (Document.body.scrollHeight, document.documentElement.scrollHeight);   3 }

4. How to use

1Window.onscroll=function(){2     //Height of window visual range3     varheight=getclientheight (),4         //window scroll bar height5theight=getscrolltop (),6         //Height of window visual range7rheight=getscrollheight (),8         //height of scroll bar distance from bottom9bheight=rheight-theight-height;Ten          Onedocument.getElementById (' show '). Innerhtml= ' At this time the browser visible area height is: ' +height+ ' <br/> At this time the actual height of the document content is: ' +rheight+ ' <br/ > The height at the top of the scrollbar is: ' +theight+ ' <br/> The height at the bottom of the scroll bar is: ' +Bheight; A}

JS Gets the height of the window scrollbar, the height of the window's visible range, the actual content height of the document, the height of the scroll bar from the bottom of the browser