Hola y buenas noches.

Estoy tratando de hacer que el desplazamiento sea imposible al llegar a un determinado div, y volver a hacerlo posible después de otro. El problema es entre aquellos que quiero mover entre divs a través de anclas.

Digamos que este es mi html:

 <div id="plano1" class="plano"> <div id="plano2" class="plano"> <div id="plano3" class="planoslide"><a href="#plano4"><button onclick="enableScroll()"><a> <div id="plano4" class="planoslide"><a href="#plano5"><button onclick="enableScroll()"><a> <div id="plano5" class="plano">

Quiero desactivar el desplazamiento al ingresar a la clase .planoslide . Tengo dos funciones que agregan o eliminan la clase .stop-scrolling que tiene la height:100% y overflow:hidden . La función disabledScroll se activa al ingresar a la clase planoslide , pero se detiene en seco, ya sea a media altura o si me desplazo demasiado incluso después. Así que tuve que animarlo casi al ingresar al div para que se desplace al lugar correcto. Ahora mismo este es mi código:

 function disableScroll() { $('body').addClass('stop-scrolling'); $('body').bind('touchmove', function(e){e.preventDefault()}) } function enableScroll() { $('body').removeClass('stop-scrolling'); $('body').unbind('touchmove'); } $(window).bind('scroll', function() { if($(window).scrollTop() >= ($('.planoslide').offset().top + $('.planoslide').outerHeight() - window.innerHeight)*0.1) { disableScroll(); $('html,body').animate({ scrollTop: $(".planoslide").offset().top}, 2000); } });

El problema es cuando uso el botón con onclick para habilitar el desplazamiento nuevamente, no sucede nada. Deseaba que no solo habilitara el desplazamiento hacia atrás nuevamente, sino que también navegara a la supuesta ID a la que lo envío.

Además, el primer enableScroll debería habilitarlo y deshabilitarlo nuevamente al ingresar al nuevo .planoslide , pero aún no he llegado a ese.

La ayuda sería muy apreciada.

Saludos.