Question

我希望检测用户何时滚动到页面底部，然后尝试继续滚动但是没有任何内容可以滚动/查看。

我正在创建可用性指标，其中死滚动是一个指标，需要一种方法来准确检测用户何时尝试滚动，但不提供任何可供查看的内容。

当鼠标滚轮事件启动但页面不向上/向下滚动页面时，我需要触发的东西。

Answer 1

这是我用来阻止页面在达到底部时动画滚动的脚本的施法：

var gate = $(window), edge;
setLength();

gate.resize(function() {
  setLength();
});

function setLength() {
  edge = $(document).height()-gate.height();
}

gate.mousewheel(function(event, delta) {

    outset = gate.scrollTop();
    if (delta == 1 && outset == 0 ) console.log('top');
    if (delta == -1 && outset == edge) console.log('bottom');
});

我正在使用鼠标滚轮插件，它非常棒，并且对于任何良好的跨浏览器支持，您必须编写一堆代码来规范化滚轮事件...

https://plugins.jquery.com/mousewheel/

我想这会做出问题中提出的问题 - 检测鼠标滚轮事件是否会使页面滚动超出其限制。对于思想实验，虽然你也可以领先一步，但只有在mousewheel被用作制定者时才能准确。当用户触发mouswheel事件时，可以使页面滚动精确的像素量。当页面的目的地已知时，您可以检查它是否位于页面的顶部或底部。

Answer 2

添加windows scrollTop（）和height。如果它等于文档高度，则位于页面底部。

$(window).scroll(function() {
   if($(window).scrollTop() + $(window).height() == $(document).height()) {
       console.log("Page bottom reached!");
   }
});

http://jsfiddle.net/1v3cakn9/1/

检测页面底部的死滚动（鼠标滚轮，滚动事件）

2 个答案: