關于scrollLeft,scrollTop的瀏覽器兼容性測試_javascript技巧

document.documentElement.scrollTop這個,但在chrome下這個值為0.

在有文檔聲明的情況下,也就是第一行有個dtd聲明,標準瀏覽器認識document.documentElement.scrollTop,可chrome竟然不認識這斯.在沒有文檔聲明的情況下,chrome,safari還是可以讀取到scrollTop值.因為chrome是通過document.body.scrollTop獲取值的.

解決這個問題:不用去那么麻煩去判斷瀏覽器類別,因為在不同情況下,document.body、document.documentElement都有可能獲取到不同的值的特點.問題就很好解決.
在獲取瀏覽器或某div的scrollTop或scrollLeft時，我封裝了一個方法:
代碼如下:
var ueScroll=(function(){
//獲取scrollX
function scrollX(ele){
var element=ele || document.body;
return element.scrollLeft || (document.documentElement && document.documentElement.scrollLeft);
}
//獲取scrollY
function scrollY(ele){
var element=ele || document.body;
return element.scrollTop || (document.documentElement && document.documentElement.scrollTop);
}
return {
left:scrollX,
top:scrollY
}
})()

在DEMO中各瀏覽器獲取scrollTop,scrollLeft值差異性調用的方式也很方便簡單的,只要跟普通的對象調用方式一樣.

這個也可以直接用在textarea或div獲取scrollTop,scrollLeft上的,只要后面傳進一個dom對象即可.

聲明：本網頁內容旨在傳播知識，若有侵權等問題請及時與本網聯系，我們將在第一時間刪除處理。TEL:177 7030 7066 E-MAIL:11247931@qq.com