Смена экрана по скроллу

Есть задача такая, что бы при скролле менялся экран. Срабатывает только 1 раз. Что нужно дописать, что бы срабатывало всегда?
$('#myContainer').bind('mousewheel', function(e){ var sec_1 = $(".section"); if(e.originalEvent.wheelDelta / 120 > 0) { sec_1.prev().addClass("main__current").removeClass("main__previous main__previous") sec_1.next().filter(':first').removeClass("main__current").addClass("main__next") } else { if(sec_1.hasClass("main__current" )) { sec_1.prev().removeClass("main__current").addClass("main__previous") sec_1.next().filter(':first').addClass("main__current").removeClass("main__next main__previous") } else { console.log(false) } } }); body { overflow: hidden } .main__section { position: absolute; left: 0; width: 100vw; height: 100vh; -webkit-transition: top .3s linear; transition: top .3s linear; } .main__previous { top: -100%; } .main__current { z-index: 1; top: 0; } .main__next { top: 100%; }

1

2

3

Ответ

$('#myContainer').bind('mousewheel', function(e) { var sec_1 = $(".section"); let main__current = $('.main__current'); if (e.originalEvent.wheelDelta / 120 > 0) { if (main__current.is(':first-child')) { return; } main__current.removeClass("main__current").addClass("main__next") main__current.prev().addClass("main__current").removeClass("main__next main__previous") } else { if (main__current.is(':last-child')) { return; } main__current.removeClass("main__current").addClass("main__previous"); main__current.next().addClass("main__current").removeClass("main__next main__previous") } }); body { overflow: hidden } .main__section { position: absolute; left: 0; width: 100vw; height: 100vh; -webkit-transition: top .3s linear; transition: top .3s linear; } .main__previous { top: -100%; } .main__current { z-index: 1; top: 0; } .main__next { top: 100%; }

1

2

3