如何检测用户何时滚动到非窗口元素的底部？

检测滚动到非窗口元素的底部

分页系统（如 Facebook 使用的系统）会在用户接近页面时加载其他内容页面底部。为了实现这一点，确定用户何时滚动到底部、超出可见窗口至关重要。

使用 jQuery 的解决方案：

jQuery 提供了一种有效的方法监视滚动活动。通过利用窗口对象的 .scroll() 事件处理程序，您可以建立一个侦听器，每当滚动位置发生变化时就会触发该侦听器。以下代码演示了如何检测用户何时到达页面底部：

$(window).scroll(function() {
   if($(window).scrollTop() + $(window).height() == $(document).height()) {
       alert("bottom!");
   }
});

此代码计算从页面顶部到用户当前滚动位置 ($(window). scrollTop()) 并将其添加到可见窗口的高度 ($(window).height())。如果这个总和等于文档的总高度 ($(document).height())，则表示用户已滚动到底部。

确定与底部的接近度：

另一种情况可能是检测用户何时接近底部，而不是精确到达底部。要实现此目的，请稍微修改代码如下：

$(window).scroll(function() {
   if($(window).scrollTop() + $(window).height() > $(document).height() - 100) {
       alert("near bottom!");
   }
});

当用户滚动距离底部 100 像素以内时，此代码会触发“近底部”警报。根据需要调整“100”值以定义所需的接近阈值。

以上是如何检测用户何时滚动到非窗口元素的底部？的详细内容。更多信息请关注PHP中文网其他相关文章！