Запретить автоматический прокрутки и прокрутить до div

Question

Я знаю, что есть много подобных сообщений, но все же я не добираюсь до кода, который мне нужен.

В принципе, я хочу сделать презентацию при первом прокрутке пользователя. Для этого я хочу предотвратить действие прокрутки по умолчанию и (если оно прокручивается вниз) сделать анимацию для следующего div.

window.scrolledToRed = false 
window.scrolledToGreen = false 

window.scrollTo = (to, guard) => 
    $('html, body').animate({ 
    scrollTop: $(to).offset().top 
    }, 1000, => 
    window[guard] = true 
) 

window.addEventListener 'wheel', (e) -> 
    if (e.wheelDelta < 0) 
    if (!window.scrolledToRed) 
     scrollTo('.red', 'scrolledToRed') 
    else if (!window.scrolledToYellow) 
     scrollTo('.green', 'scrolledToGreen') 

Я создал скрипку, который представляет проблему: https://jsfiddle.net/pn6zqgwu/2/

Когда пользователь прокручивает вниз в первый раз, когда я хочу, чтобы взять его к красному DIV и в следующий раз на один зеленый. Ни одно из решений, которые я пробовал, действительно сработало, поскольку оно было «прыжком» и прокруткой туда, где я хочу.

Любая идея, как решить проблему?

Благодаря передовой

Answer 1

Может быть, вам нужно позвонить e.preventDefault(), чтобы предотвратить поведение на Scroll браузер по умолчанию

Answer 2

Я сделал скрипку для вас, вы можете сделать больше проверок и добавить анимацию

var redTouched = false; 
var greenTouched = false; 

function scrollCb() { 
    event.preventDefault(); 

    console.log(event.wheelDelta) 
    if (event.wheelDelta < 0) { 
    if (!redTouched) { 
    $(window).scrollTop($('.red').position().top); 
    redTouched = true; 
    } else if (redTouched && !greenTouched) { 
    $(window).scrollTop($('.green').position().top); 
    greenTouched = true; 
} else if (redTouched && greenTouched) { 
    window.removeEventListener('mousewheel', scrollCb) 
} 
} else { 
window.removeEventListener('mousewheel', scrollCb) 
} 

window.addEventListener('mousewheel', scrollCb); 

https://jsfiddle.net/jacobjuul/b0k03wtr/