Estoy tratando de implementar una función en la que si el usuario desplaza la rueda del mouse, se desplaza hacia abajo a la siguiente sección, y cuando se desplaza nuevamente, se desplaza nuevamente a la siguiente sección. Aquí hay un ejemplo: https://dolomiti.lefayresorts.com/es

Por alguna razón mi código no funciona. Aquí está mi código:

 var justscrolled = false; function scrollUp(){ if(scrollPos > 0){ scrollPos--; scrollToSection(scrollPos); } } function scrollDown(){ if(scrollPos < maxScroll){ scrollPos++; scrollToSection(scrollPos); } } function scrollToSection(index){ justscrolled = true; var to = $("#section" + index).offset().top; console.log(index); console.log(to); $(document).scrollTop(to); } $(window).bind('mousewheel', function(event) { if (event.originalEvent.wheelDelta >= 0) { if(justscrolled){ justscrolled = false; console.log("A"); } else{ scrollUp(); console.log("B"); } } else { console.log("downscroll"); if(justscrolled){ console.log("A"); justscrolled = false; } else{ console.log("B"); scrollDown(); } } });

Cuando me desplazo, la consola registra que la función de desplazamiento funcionó, y puedo ver algunos parpadeos en mi página cuando me desplazo, pero por alguna razón, en realidad no se desplaza a las diferentes secciones.

Aquí está el archivo html completo que puede probar y ver que no funciona: https://pastebin.com/EuGS5G2a