网站上有一个元素,这个块应该在页面加载后自动水平滚动。
我做了它并写了以下内容:
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);
但是这里出现了一个问题,当加载这段代码时,一切正常,但不幸的是,在使用这种方法时,使用鼠标滚轮滚动时会出现问题。当动画进行时,在chrome浏览器中是不可能用鼠标滚轮滚动的,但是在firefox中,这是不可能的。谁遇到了这个问题,也许你有其他方法可以解决这个问题。
PS:容器样式如下:
.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;
}