【问题标题】：Trigger a function after scrolling x pixels from the top从顶部滚动 x 个像素后触发函数
【发布时间】：2018-06-06 13:14:23
【问题描述】：

我想触发一次（并且只有一次）用户从顶部向下滚动 100 像素的内容。

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

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

【问题讨论】：

非常感谢您的回复。有人发布了以下代码（我稍微编辑过），其中包含：document.documentElement.scrollTop，它工作正常。我不知道为什么它被删除了：不能与 ie 一起使用？

标签： javascript html scroll dom-events

【解决方案1】：

试试这个：

var scrollValue = window.scrollY;

【讨论】：

【解决方案2】：

scrollTop 将为您提供元素顶部和文档顶部之间的偏移量。由于 html 文档的正文默认从文档顶部开始，因此 body.scrollTop 始终保持为 0，除非您专门使用 css 使正文不从顶部开始。

所以你必须使用scrollY 而不是scrollTop。如果您使用的浏览器不支持scrollY（例如IE），您可以尝试pageYOffset。

【讨论】：

【解决方案3】：

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

您需要使用 Window.scrollY 属性，而不是 scrollTop 属性。

这应该是你的代码：

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 作为解决方法。

【讨论】：

好像“Window.scrollY”和ie不兼容
@jeremy 是的，但是您可以在 IE 中使用 window.pageYOffset 作为替代品，但它总是给出数百个四舍五入的值，或者您可以检查 accepted answer here 它使用 document.documentElement.scrollTop 作为解决方法。