Javascript 鼠标停止时保持滚动容器

我有很多水平滚动的容器，我用鼠标移动它们。当鼠标在纯javascript中停止时，如何保持滚动

我尝试添加带有超时的助手函数，但结果显示它的动画效果很奇怪

谢谢你的帮助

下面是我目前正在使用的一段代码-将鼠标悬停在行上以向左向右滚动

window.onload=function（）{
var gamerow=document.queryselectoral（“.gamerow”）；
如果（gamerow）{
函数类（节点）{
var className=node.className；
var num=0；
对于（变量i=0；imax\u scroll）scrolla[x]=max\u scroll；
this.scrollLeft=scrolla[x]；
}
} );
item.addEventListener（'mouseleave'，函数stopHoverly（e）{
e=window.event | | e；
var container_w=this.offsetWidth；
var max_scroll=this.scrollWidth-this.offsetWidth；
var速度=0；
这个.setAttribute（“id”，“滚动”）；
var x=indexInClass（document.getElementById（'scrolling'）；
如果（速度！==0）{
scrolla[x]+=速度/15；
如果（scrolla[x]<0）scrolla[x]=0；
如果（scrolla[x]>max\u scroll）scrolla[x]=max\u scroll；
this.scrollLeft=scrolla[x]；
}
此.removeAttribute（“id”、“滚动”）；
} );
}
};
};
.gamerow{
填充：0px 15px；
文本对齐：左对齐；
显示器：flex；
柔性包装：nowrap；
溢出-x：自动；
-webkit溢出滚动：触摸；
溢出y：隐藏；
变换：比例（1）；
}
.里面{
宽度：150px；
高度：50px；
显示：内联块；
文本对齐：居中；
边框：2倍实心#000；
保证金：0px 8px 8px 0px；
flex:0自动；
盒影：-1px 1px 1px#adadad；
边界半径：5px；
}
：-webkit滚动条{
显示：无；
}
您可以使用
setInterval
以给定的间隔重复调用函数

我从事件处理程序中删除了更新实际
scrollLeft
属性的代码，并将其放入一个每10毫秒调用一次的函数中（您可能需要调整该间隔）。我还将
x
、
speed
和
max\u scroll
的变量声明移动到
for
循环的外部，以便新函数可以访问它们

就性能而言，这可能不是最好的解决方案，但它确实有效

Edit:将对
setInterval
的调用移出for循环


window.onload=function（）{
var gamerow=document.queryselectoral（“.gamerow”）；
如果（gamerow）{
函数类（节点）{
var className=node.className；
var num=0；
对于（变量i=0；imax\u scroll）scrolla[x]=max\u scroll；
gamerow[x].scrollLeft=scrolla[x]；
}
}, 10);
};
};
.gamerow{
填充：0px 15px；
文本对齐：左对齐；
显示器：flex；
柔性包装：nowrap；
溢出-x：自动；
-webkit溢出滚动：触摸；
溢出y：隐藏；
变换：比例（1）；
}
.里面{
宽度：150px；
高度：50px；
显示：内联块；
文本对齐：居中；
边框：2倍实心#000；
保证金：0px 8px 8px 0px；
flex:0自动；
盒影：-1px 1px 1px#adadad；
边界半径：5px；
}
：-webkit滚动条{
显示：无；
}