不使用 jQuery 检测滚动方向
在 Web 开发中，检测滚动方向对于实现无限滚动或折叠等功能非常有用工具栏。虽然像 jQuery 这样的库提供了简单的解决方案，但让我们探索如何在不使用它们的情况下实现这一点。
要确定滚动方向，我们可以跟踪先前的滚动位置（scrollTop 或 pageYOffset）并将其与当前滚动进行比较位置。这种差异表明我们是向上还是向下滚动。
下面是演示此方法的 JavaScript 片段：
<code class="javascript">var lastScrollTop = 0;
// element should be replaced with the actual target element on which you have applied scroll, use window in case of no target element.
element.addEventListener("scroll", function(){
var st = window.pageYOffset || document.documentElement.scrollTop; // Credits: "https://github.com/qeremy/so/blob/master/so.dom.js#L426"
if (st > lastScrollTop) {
// downscroll code
} else if (st < lastScrollTop) {
// upscroll code
} // else was horizontal scroll
lastScrollTop = st <= 0 ? 0 : st; // For Mobile or negative scrolling
}, false);</code>在此代码中，我们检查当前滚动位置是否大于或小于上一个滚动位置。如果它更大，我们将向下滚动，如果它更小，我们将向上滚动。水平滚动也是通过检查滚动位置是否不变来考虑的。
通过存储之前的滚动位置并将其与当前位置进行比较，我们可以有效地检测滚动方向，而不需要外部库。该方法可以应用于各种元素，包括用于全局滚动检测的窗口对象。
以上是如何在没有 jQuery 的情况下确定 JavaScript 中的滚动方向？的详细内容。更多信息请关注PHP中文网其他相关文章！
