Есть элемент на веб-сайте, данный блок должен автоматически скроллиться горизонтально после подгрузки страницы.
Я его сверстал, написал следющее:
scrolling = setInterval(() => {
let scrolled = targetElement.scrollLeft;
targetElement.scrollTo(targetElement.scrollLeft + 1, 0);
// scrolled to the end, start again
if (scrolled === targetElement.scrollLeft) {
targetElement.scrollLeft = 0;
}
}, 10);
Но тут возникает проблема, когда подгружается данный код всё работает но к сожалению при использовании данного метода возникает проблема при скроллине колесиком мыши. Когда идет анимация, в браузере хрома невозможно скроллить с помощью колесика мыши, а в фаерфоксе например такого нет. Кто сталкивался с этой проблемой, и быть может у вас есть какой-нибудь другой способ решения данной проблемы.
P.S: Стили контейнера следующие:
.providers {
display: grid;
overflow-x: scroll;
grid-template-columns: max-content;
grid-template-rows: 1fr 1fr;
grid-auto-columns: 200px !important;
grid-auto-flow: column;
grid-gap: 20px;
margin-top: 76px;
}