添加延迟鼠标输出功能
问题描述:
我有一个下拉菜单,添加延迟鼠标输出功能
<ul>
<li><a>link 1</a>
<ul><li><a>link 1</a></li></ul>
</li>
</ul>
我使用以下JS使用悬停并显示孩子的菜单。
我想延迟500ms左右加鼠标输出功能(当类的LI的去除),
$('li').hover(function(){
$(this).addClass('over');
}, function(){
$(this).removeClass('over');
});
请在此做要紧的。
在此先感谢
答
你可以做这样的事情:
$('li').hover(function(){
var timer = $(this).data('timer');
if(timer) clearTimeout(timer);
$(this).addClass('over');
}, function(){
var li = $(this);
li.data('timer', setTimeout(function(){ li.removeClass('over'); }, 500));
});
这盘旋在它时清除任何超时(如果你悬停,离开,盘旋回你需要检查这个),并且在离开悬停时设置500ms延迟,使用.data()
在li上存储超时ID。
答
$('li').hover(function(){
$(this).addClass('over');
}, function(){
setTimeout(function(){$(this).removeClass('over')}, 500);
});
[延迟jquery悬停事件?](http://*.com/questions/435732/delay-jquery-hover-event) – zaf 2010-05-10 09:25:45