如何设置悬停时的停止时间？

Question

这是我要更改的代码：

$("#header_nav").mouseenter(function(){
            $('#header_nav').stop().animate({
                height:'50px'
            },600); 
});


$("#header_nav").mouseleave(function(){
            $('#header_nav').stop().animate({
                height:'100px'
            },600);
});

http://jsfiddle.net/JJ8Jc/318/

问题：如何设置停止时间（鼠标悬停在该区域没有响应的时间）？

谢谢。

Answer 1

不清楚你所说的“停止时间”是什么意思，但我猜你的意思是你不希望动画在鼠标悬停在元素上至少一段时间后开始，说500毫秒。如果是这样，那么您可以使用.delay() method，并使用true 参数调用.stop() 以清除队列中的所有动画：

$("#header_nav").mouseenter(function(){
        $(this).stop(true).delay(500).animate({
            height:'50px'
        },600); 
}).mouseleave(function(){
        $(this).stop(true).animate({
            height:'100px'
        },600);
});

更新版演示：http://jsfiddle.net/JJ8Jc/321/