javascript - 从顶部滚动 x 像素后触发函数

Question

我想在用户从顶部向下滚动 100 像素时触发一次(且仅一次)。

过去我得到了这段代码，但它似乎不起作用？

window.onscroll = function() {
  var scrollLimit = 100;
  var scrollValue = document.body.scrollTop;
  if (scrollValue >= scrollLimit) {
    alert("x")
  }
};

Answer 1

您在这里使用了错误的属性。

您需要使用 Window.scrollY 而不是 scrollTop 属性 属性(property)。

你的代码应该是这样的:

window.onscroll = function() {
  var scrollLimit = 100;
  if (window.scrollY >= scrollLimit) {
    alert("x")
  }
};

注意事项:

window.scrollY 与 IE 的兼容性问题:

不幸的是，window.scrollY 不适用于 IE 浏览器，对于 IE，您可以使用 window.pageYOffset 作为替代，但它总是提供数百个舍入值 (100, 200, 300, ...)。

否则你可以检查accepted answer here它使用 document.documentElement.scrollTop 作为解决方法。