Javascript 如何停止用户交互上的向左滚动动画

我这里有以下代码：

<script>
$(document).ready(function() {

    $('.scrolls').stop().animate({
        scrollLeft : 4000
    },100000, 'linear')
})
</script>

$（文档）.ready（函数（）{
$（'.scrolls'）.stop（）.animate({
左：4000
}，100000，“线性”）
})

我希望在用户与该div中的滚动条交互时能够立即停止动画。我是jquery新手，因此如果有人能帮助我，我将不胜感激

---

我刚试着在单击时停止动画，它成功了。我想你所需要做的就是决定你想要收听的事件：

我用过：

    $(".scrolls").on("click",function(){
        $(this).stop(true,false);
});

---

这个答案在JSFIDLE上有效，但在我的网站上无效。我现在正在使用mamp，运行wordpress，首先，它似乎无法识别这个部分var$viewport=$（'.scrolls'）；如果我将所有$viewport更改为$（'.scrolls'），动画将开始，但不会停止。所以它不能识别.bind部分。我是jquery新手，所以我不知道为什么它不这么做，但它不是：/