Question

我有4个图标，在鼠标悬停时，使用jquery animate滚动div。

问题是，当我快速，快速地悬停在所有四个图标上时，悬停功能被链接在一起，甚至在鼠标移出时，滚动动画仍然会一直运行，直到所有鼠标悬停在发生的事件上完成。

我想在鼠标输出时这样做，所有等待执行的事件都会被取消！

在下面找到来源：

<div id="sidebar-slider-nav">
    <div class="testimonials" onmouseover="sidebar_slider(0)"><img src="images/icons/testimonialsIcon.png"/></div>
    <div class="facebook" onmouseover="sidebar_slider(280)"><img src="images/icons/facebookIcon.png"/></div>
    <div class="twitter" onmouseover="sidebar_slider(560)"><img src="images/icons/twitterIcon.png"/></div>
    <div class="news" onmouseover="sidebar_slider(840)"><img src="images/icons/blogIcon.png"/></div>
    <div class="clear"></div>
</div>

并且调用的函数是：

function sidebar_slider(val){
    $('#sidebar-slider').animate({scrollLeft:val},500)
}

有人知道更好的方法吗？

有关我的问题的示例，请导航至http://a3mediauk.co.uk并查看侧边栏！三江源

Answer 1

$('#sidebar-slider').stop();

将清除元素上的任何现有动画。您也可以将其链接到现有代码中：

$('#sidebar-slider').stop().animate({scrollLeft:val},500)

如何防止javascript中的事件链接

1 个答案: