在做滾動(dòng)獲取更多的這個(gè)需求中贮勃，我們需要獲取到滾動(dòng)條高度贪惹、窗口可視范圍高度、文檔實(shí)際內(nèi)容高度寂嘉、滾動(dòng)條離瀏覽器底部的高度奏瞬。
1. 獲取窗口可視范圍的高度
function getClientHeight(){
var clientHeight=0;
if(document.body.clientHeight&&document.documentElement.clientHeight){
var clientHeight=(document.body.clientHeight<document.documentElement.clientHeight)?document.body.clientHeight:document.documentElement.clientHeight;
}else{
var clientHeight=(document.body.clientHeight>document.documentElement.clientHeight)?document.body.clientHeight:document.documentElement.clientHeight;
}
return clientHeight;
}
2. 獲取窗口滾動(dòng)條高度
function getScrollTop(){
var scrollTop=0;
if(document.documentElement&&document.documentElement.scrollTop){
scrollTop=document.documentElement.scrollTop;
}else if(document.body){
scrollTop=document.body.scrollTop;
}
return scrollTop;
}
3. 獲取文檔內(nèi)容實(shí)際高度
function getScrollHeight(){
return Math.max(document.body.scrollHeight,document.documentElement.scrollHeight);
}
4. 方法結(jié)合使用
window.onscroll=function(){
// 窗口可視范圍的高度
var height=getClientHeight(),
// 窗口滾動(dòng)條高度
theight=getScrollTop(),
// 窗口可視范圍的高度
rheight=getScrollHeight(),
// 滾動(dòng)條距離底部的高度
bheight=rheight-theight-height;
document.getElementById('show').innerHTML='此時(shí)瀏覽器可見區(qū)域高度為：'+height+'<br />此時(shí)文檔內(nèi)容實(shí)際高度為：'+rheight+'<br />此時(shí)滾動(dòng)條距離頂部的高度為：'+theight+'<br />此時(shí)滾動(dòng)條距離底部的高度為：'+bheight;
