Как управлять горизонтальной прокруткой с помощью кнопок? ⇐ CSS
-
Anonymous
Как управлять горизонтальной прокруткой с помощью кнопок?
Идея состоит в том, что когда я нажимаю кнопку, прокрутка должна двигаться в том направлении, в котором я нажал, пока кнопка удерживается нажатой. С первой попытки все работало, но внезапно перестало работать.
экспортировать функцию по умолчанию initCarousel() { const carousel = document.querySelector("[data-carousel='scroll']"); const rightBtn = document.querySelector("[data-carousel='right']"); const leftBtn = document.querySelector("[data-carousel='left']"); пусть таймер; leftBtn.addEventListener("mousedown", () => { таймер = setInterval(() => { карусель.scrollLeft -= 50; }, 20); }); rightBtn.addEventListener("mousedown", () => { таймер = setInterval(() => { карусель.scrollLeft += 50; }, 20); }); leftBtn.addEventListener("mouseup", () => { если (таймер) ClearInterval (таймер); }); rightBtn.addEventListener("mouseup", () => { если (таймер) ClearInterval (таймер); }); }
Идея состоит в том, что когда я нажимаю кнопку, прокрутка должна двигаться в том направлении, в котором я нажал, пока кнопка удерживается нажатой. С первой попытки все работало, но внезапно перестало работать.
экспортировать функцию по умолчанию initCarousel() { const carousel = document.querySelector("[data-carousel='scroll']"); const rightBtn = document.querySelector("[data-carousel='right']"); const leftBtn = document.querySelector("[data-carousel='left']"); пусть таймер; leftBtn.addEventListener("mousedown", () => { таймер = setInterval(() => { карусель.scrollLeft -= 50; }, 20); }); rightBtn.addEventListener("mousedown", () => { таймер = setInterval(() => { карусель.scrollLeft += 50; }, 20); }); leftBtn.addEventListener("mouseup", () => { если (таймер) ClearInterval (таймер); }); rightBtn.addEventListener("mouseup", () => { если (таймер) ClearInterval (таймер); }); }
Мобильная версия