瀏覽器的窗口高度

window高度應(yīng)當(dāng)是文檔所在窗口的可視高度(沒有包括瀏覽器的滾動(dòng)條),計(jì)算方法document.documentElement.clientHeight

document高度應(yīng)該為文檔內(nèi)容的高度,計(jì)算方法Math.max(document.body[ "scrollHeight" ], document.documentElement[ "scrollHeight"])

html高度應(yīng)當(dāng)為html元素的高度(包括邊框滾動(dòng)條),計(jì)算方法htmlElement.offsetHeight

body高度是body元素的高度(包括邊框滾動(dòng)條),計(jì)算方法bodyElements.offsetHeight;


$(window).scrollTop()和$(document).scrollTop()具有相同的效果,都為返回滾動(dòng)條的垂直位置,但是$(window).scrollTop()被所有瀏覽器支持。

$(document)是獲取文檔對(duì)象?

$(window)是獲取窗口對(duì)象

$('body,html')獲取的是文件本身


$(window).scroll和$(window).scrollTop()為0的問題

問題1:$(window).scroll無效問題

如果你的css中:html,body的高度樣式如果設(shè)置為100%,那么$(window).scroll方法將檢測(cè)不到正確的滾出高度(0),導(dǎo)致滾動(dòng)監(jiān)聽事件失效。

解決方法:

設(shè)置html,body{height:auto}可以解決。

問題2:$(window).scrollTop()獲取值一直為0--------------兼容性問題

是兼容各種瀏覽器的寫法,分別為獲取當(dāng)前的scrollTop和設(shè)置scrollTop:

 function?getScrollTop()?{ ?      ? ? ? ? ? ? ? ? ? ? ? ? ? ?var?scrollTop?=?document.documentElement.scrollTop?||?window.pageYOffset?||?document.body.scrollTop; ?

  return?scrollTop; ?

    }??

function?setScrollTop(scroll_top)?{??

      document.documentElement.scrollTop?=?scroll_top;

      ?window.pageYOffset?=?scroll_top;??

      ?document.body.scrollTop?=?scroll_top;??

    ?}??

?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
平臺(tái)聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點(diǎn),簡(jiǎn)書系信息發(fā)布平臺(tái),僅提供信息存儲(chǔ)服務(wù)。

推薦閱讀更多精彩內(nèi)容