首頁  >  文章  >  web前端  >  javascript scrollTop正解使用方法

javascript scrollTop正解使用方法

高洛峰
高洛峰原創
2016-12-29 10:17:011767瀏覽

javascript scrollTop 取得捲軸相對於其頂部的偏移(如製作自動顯示隱藏的「返回頂部」按鈕)。在實際應用上常會遇到以下問題:
document.documentElement.scrollTop在Chrome裡總為0
document.body.scrollTop 在IE和firefox裡總為0

1、各瀏覽器下window.pageYOffset/document .documentElement.scrollTop/document.body.scrollTop的差異
範例:

<span style="font-size: 16px;">window.scroll(0,100)<br/>console.log(“window.pageYOffset:”+window.pageYOffset)<br/>console.log(“document.documentElement.scrollTop:”+document.documentElement.scrollTop)<br/>console.log(“document.body.scrollTop:”+document.body.scrollTop)</span>
IE6/7/8:
doctype:
window.pageYOffset:undefined
document.doctype:
window.pageYOffset:undefineddocument.documents).



無doctype:
window.pageYOffset:undefined
document.documentElement.scrollTop:0
document.body.scrollTop:1005%/Ccont. .scrollTop:0
document.body.scrollTop:100

Firefox/Opera:

doctype:

window.pageYOffset:100com
無doctype :
window.pageYOffset:100
document.documentElement.scrollTop:0
document.body.scrollTop:100


2、獲取scrollTop值白解使用方法相關文章請關注PHP中文網!


陳述:
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn