javascript - 测量滚动速度 Javascript 和触发事件

Question

我想在窗口滚动速度超过某个值时触发一个事件。我找到了一些有助于测量速度的代码，但我无法弄清楚为什么当速度超过 150 时没有触发 if 语句。我们将不胜感激任何帮助。

const checkScrollSpeed = (function(settings){
    settings = settings || {};

    let lastPos, newPos, timer, delta, 
        delay = settings.delay || 50;

    function clear() {
        lastPos = null;
        delta = 0;
    }

    clear();

    return function(){
        newPos = window.scrollY;
        if ( lastPos != null ){ // && newPos < maxScroll 
            delta = newPos -  lastPos;
        }
        lastPos = newPos;
        clearTimeout(timer);
        timer = setTimeout(clear, delay);
        return delta;
    };
})();

const container = document.querySelector('#container');

window.addEventListener('scroll', function() {
    console.log(checkScrollSpeed());
    if (checkScrollSpeed() > 150) {
        console.log('150+')
        container.classList.add('red');
    }
});

#container {
  width: 75%;
  height: 170vh;
  background-color: yellow;
}
#container.red {
  background-color: red !important;
}

<div id="container"></div>

Answer 1

您正在连续调用 checkScrollSpeed，当第二次调用时，delta 为 0。删除 console.log 或将 delta 分配给某个变量并将其用于日志记录和条件。