检测浏览器窗口的 scrollTop 的最佳跨浏览器方法是什么?我不喜欢使用任何预先构建的代码库,因为这是一个非常简单的脚本,而且我不需要所有这些无谓的东西。
跨浏览器检测浏览器窗口scrollTop的方法
IT技术
javascript
cross-browser
2021-02-17 05:43:40
6个回答
function getScrollTop(){
if(typeof pageYOffset!= 'undefined'){
//most browsers except IE before #9
return pageYOffset;
}
else{
var B= document.body; //IE 'quirks'
var D= document.documentElement; //IE with doctype
D= (D.clientHeight)? D: B;
return D.scrollTop;
}
}
alert(getScrollTop())
或者就这么简单:
var scrollTop = document.body.scrollTop || document.documentElement.scrollTop;
如果您不想包含整个 JavaScript 库,您通常可以从中提取您想要的位。
例如,这本质上是jQuery 实现跨浏览器滚动(Top|Left)的方式:
function getScroll(method, element) {
// The passed in `method` value should be 'Top' or 'Left'
method = 'scroll' + method;
return (element == window || element == document) ? (
self[(method == 'scrollTop') ? 'pageYOffset' : 'pageXOffset'] ||
(browserSupportsBoxModel && document.documentElement[method]) ||
document.body[method]
) : element[method];
}
getScroll('Top', element);
getScroll('Left', element);
注意:您会注意到上面的代码包含一个browserSupportsBoxModel
未定义的变量。jQuery通过在页面上临时添加一个 div 然后测量一些属性来确定浏览器是否正确实现了框模型。正如您可以想象的那样,此标志会检查 IE。具体来说,它会在 quirks mode 中检查IE 6 或 7。由于检测相当复杂,我将它留给您作为练习 ;-),假设您已经在代码的其他地方使用了浏览器 功能 检测。
编辑:如果你还没有猜到,我强烈建议你使用一个库来处理这些事情。开销是为健壮且面向未来的代码支付的一小部分代价,任何人都可以使用跨浏览器框架进行构建,从而提高工作效率。(而不是花费无数个小时来对抗 IE)。
我一直在用window.scrollY || document.documentElement.scrollTop
。
window.scrollY
涵盖除 IE 之外的所有浏览器。
document.documentElement.scrollTop
涵盖 IE。
function getSize(method) {
return document.documentElement[method] || document.body[method];
}
getSize("scrollTop");
其它你可能感兴趣的问题