为什么scrollTop的,pageYOffset和高度都不能正常工作?(Why are scrol

2019-10-16 14:39发布

我想(如果内容超过了窗口高度和溢出),以检测是否有垂直滚动条或者没有在浏览器窗口。 我已经试过document.body.scrollTopwindow.pageYOffsetdocument.body.style.height ......这些都不是工作!

一旦这样一个window.alert与这些属性初始化的变量测试, pageYOffset总是返回0,无论是否有滚动条与否,和其他两个什么样的回报似乎是一个空字符串。

我唯一的想法是,也许CSS定位的冲突是造成这一点,但似乎有没有这样的冲突......任何出主意,想办法,解决方法?

Answer 1:

这个

window.innerWidth - document.documentElement.clientWidth

返回浏览器的窗口的垂直滚动条的宽度,和0如果不存在滚动条。

所以,你可以有一个函数...

function windowHasVerticalScrollbar () {
    return window.innerWidth - document.documentElement.clientWidth > 0;
}

不幸的是,IE8和IE7不支持window.innerWidth值,所以这种技术不会在这些浏览器。 (但是,它在IE9工作和所有其他的浏览器)。

此外,由于documentElement<html>元素(网页的根元素),如果设置该元件上的样式(如边距,绝对定位等),该计算可以返回不正确的结果。



文章来源: Why are scrollTop, pageYOffset, and height all not working?