我已经做了一个非常简单的下拉菜单,使用jQuery slideup和sliedown的功能 – 但它变得非常跳跃(我使用Firefox 3.6.8),如果鼠标移动到快速,或者如果鼠标被保持其中一个子菜单项.
我在以下链接中提供了一个工作示例：
没有.stop(true,true)的功能更糟.我也尝试添加hover-intent,但是因为我在同一个div中有一个悬停触发的幻灯片,它与幻灯片的功能冲突.
有没有我失踪的东西？我听到clearqueue可能会工作,或者可能暂停,但是无法确定哪里可以添加它们.
感谢所有
解决方法
你可以稍微延迟一点,说200毫秒的动画完成,所以它不是跳跃,但离开.stop(),所以它仍然不会建立,像这样：
$(function () {
$('#nav li').hover(function () {
clearTimeout($.data(this,'timer'));
$('ul',this).stop(true,true).slideDown(200);
},function () {
$.data(this,'timer',setTimeout($.proxy(function() {
$('ul',true).slideUp(200);
},this),200));
});
});
You can give it a try here,这种方法使用$.data()来存储每个元素的超时,所以每个菜单独立处理,如果你有很多菜单项,这应该给一个很好的效果.