幻灯片效果发生太多次

Question

我在onmouseover和onmouseout上为几个div调用了这个函数。

//Takes effect on divs with id, 62,63,64,65... 
function slide_it(id){ 

    $('#options_'+id).slideToggle('slow'); 

} 

的问题是，如果我过了，还是那句话，鼠标移动我的鼠标，然后鼠标和鼠标，然后出来。如果我多次这样做，幻灯片效果发生的次数与我预期的一样，将鼠标移出并移出div。

但我无法弄清楚我该如何做到这一点一次？我可以设置一个变量，但是我有几个div使用了这个函数，我想不出一个简单的方法来完成这个任务，而不是把数据存储到一个数组中，但是这很麻烦！

我真的很感谢任何帮助，这很容易实现！

感谢所有的帮助

Answer 1

在打电话之前，slideToggle()，使用.stop(true)，这将结束当前的动画（如果有的话），因为你要链接，将立即启动您所提供的动画，就像这样：

$('#options_'+id).stop(true).slideToggle('slow'); 

From the docs：

当在元素上调用.stop()时，当前正在运行的动画（如果有）立即停止。例如，如果一个元素被.slideUp()隐藏，当调用.stop()时，该元素现在仍然会显示，但是会是其之前高度的一小部分。回调函数不被调用。

示例：如果您快速悬停进出，我不等待完成滑动，它会停止滑动，并在鼠标离开时开始滑出。

Answer 2

尝试删除您的onmouseover和onmouseout从DIV处理其滑动。你可以用jQuery小号one()方法做这里面slide_it(id)功能

Answer 3

绑定的事件：http://api.jquery.com/one/

Answer 4

这是因为所有的效果都加入到一个效果，队列和其他出场后一个。

清除此队列很简单，只需添加clearQueue（）：

function slide_it(id){ 

    $('#options_'+id).clearQueue().slideToggle('slow'); 

}