Непонятное поведение scroll event?

Question

[Cерж Белоус]

Это, казалось бы, простой код для прокрутки страницы. Но временами прокрутка не срабатывает, или останавливается. В чем причина такого поведения?

let ay = 1;
let vy = 5;
let scrollStarted = false;
let step = () => {
  // vy += ay;  
  scrollStarted = true;
  window.scrollBy(0, 5);
  window.requestAnimationFrame(step)
}

$(document).bind('DOMMouseScroll mousewheel', function(e, delta) {
  if(!scrollStarted){
    window.requestAnimationFrame(step)
  }
})

Answer 1

[Taulan Khatuaev]

let vy = 5;
let scrollStarted = false;
let userInteracting = false;

function step() {
    if (!userInteracting) {  // Продолжаем прокрутку, только если пользователь не взаимодействует
        window.scrollBy(0, vy);
        window.requestAnimationFrame(step);
    }
}

$(document).bind('DOMMouseScroll mousewheel', function(e) {
    userInteracting = true;  // Пользователь начал прокрутку
    clearTimeout(window.scrollTimeout);
    window.scrollTimeout = setTimeout(function() {
        userInteracting = false;  // Предполагаем, что пользователь закончил прокрутку после задержки
        if (!scrollStarted) {
            scrollStarted = true;
            window.requestAnimationFrame(step);
        }
    }, 200);  // Задержка в 200 мс, после которой считаем, что пользовательские действия прекратились
});

// Начальный запуск анимации
if (!scrollStarted) {
    scrollStarted = true;
    window.requestAnimationFrame(step);
}

Comments

[Cерж Белоус]

Спасибо, я попробовал ваш код, но не заработало вообще никак. Возможно я что-то упускаю (Точней, я понимаю, что что-то упускаю. =), но смысла в setTimeout и переменной userInteracting я не увидел. Приведенный мною выше код не мешает прокрутке страницы пользователем. Вопрос лишь в том, почему прокрутка в какой-то момент останавливается, а иногда и не начинается вовсе.