Estoy usando un código para deshabilitar el desplazamiento y también conservar la barra de desplazamiento cuando el menú de pantalla completa está activo, pero cuando se abre el menú haciendo clic en el ícono de la hamburguesa, la página salta a la parte superior. ¿Alguna idea de cómo evitar que esto suceda?
.noscroll { position: fixed; overflow-y:scroll; }
jQuery(document).ready(function($){ $('.btn-open-menu').click(function () { $('html, body').addClass('noscroll'); }) $(document).on('click','.btn-close-menu', function(event){ $('html, body').removeClass('noscroll');( {}, event); }) });```
Yo intentaría algo como:
Estoy usando un código para deshabilitar el desplazamiento y también conservar la barra de desplazamiento cuando el menú de pantalla completa está activo, pero cuando se abre el menú haciendo clic en el ícono de la hamburguesa, la página salta a la parte superior. ¿Alguna idea de cómo evitar que esto suceda?
.noscroll { position: fixed; overflow-y:scroll; } jQuery(document).ready(function($){ $('.btn-open-menu').click(function () { let scrollPosition = $(document).scrollTop(); $('html, body').addClass('noscroll'); $('html, body').css('top', '-'+scrollPosition+'px'); $('html, body').attr('data-scroll', scrollPosition); }) $(document).on('click','.btn-close-menu', function(event){ $('html, body').removeClass('noscroll');( {}, event); $(document).scrollTop( $('html, body').attr('data-scroll') ) }) });
Esto hará que el cuerpo sea fijo, pero establecerá su posición en la posición de desplazamiento actual en lugar de en la parte superior de la página.
EDITAR: intente guardar la posición de desplazamiento en el atributo del elemento para que pueda acceder a él mientras cierra el menú y establezca la posición de desplazamiento del documento en consecuencia
Creo que el problema es tu css, uso un sistema similar en algunos de mis sitios y el css que uso es solo:
.noscroll { overflow: hidden; }