当已经到达页面底部时，如何检测用户是否仍在尝试滚动？

Question

在页面底部，我有三个 <div>，每个代表一个步骤。 当用户一直滚动到页面底部时它们变得完全可见，因此每当用户尝试进一步滚动（超出页面底部）时，我都想推进 CSS 动画，并突出显示三个中的一个用户滚动时的步骤。动画将包含一个火箭飞船图标，当用户不断尝试滚动时，该图标将从左移动到右，当前步骤以较浅的颜色突出显示 - 用作进度条，指示当前步骤。< /p>

但是，问题是在滚动条已经到达页面底部之后，我似乎无法检测到滚动事件。如何让事件处理程序接收这些滚动尝试？

这是我设置的在到达页面底部后不会调用的事件处理程序：

window.onscroll = function(ev) {
    if ((window.innerHeight + window.scrollY) >= document.body.offsetHeight) {
        console.log("You're at the bottom of the page");
    }
};

这是我要推进的三个步骤：

Answer 1

使用 onwheel 事件：

window.onwheel = function(ev) {
    if ((window.innerHeight + window.scrollY) >= document.body.offsetHeight) {
        console.log("You're at the bottom of the page");
    }
};