Как убрать прокрутку страницы при нажатии на показать еще?
Есть небольшой сайт, с небольшим количеством товаров, в мобильной версии нужно чтобы отображалось несколько товаров, но появлялась кнопка показать сделал все на display none. Есть код, но когда я нажимаю показать еще меня сразу перебрасывает на последний элемент, а мне нужно чтобы в каком месте страницы я кнопку нажал, в таком и остался, как сделать?
let state = 0;
$('.catalog__button').click(function (e) {
e.preventDefault();
if(state == 0) {
$('.catalog__mobile').show();
$('.catalog__button').text('Скрыть');
state ++;
}
else {
$('.catalog__mobile').hide();
$('.catalog__button').text('Посмотреть все');
state --;
}
});
Ответы (1 шт):
На body примените свойство overflow-anchor:
body {
overflow-anchor: none;
}
Только учтите, что данное свойство не работает в IE и Safari.
P.S. Также я бы советовал отказаться в вашем примере от jQuery – данный функционал легко написать на нативном JavaScript, используя classList API и метод toggle в частности: например, можно по клику переключать класс со свойством display: none.