中的mouseenter和鼠标离开事件

Question

使用的setTimeout我有以下几点：

$("#header .navigation li.menu-item-first a").mouseenter(function() { 
    $(".sub-nav").css("display", "block"); 
}).mouseleave(function() { 
    $(".sub-nav").css("display", "none"); 
}); 

我不想.sub-nav尽快消失，当用户移动鼠标了。 我如何将setTimeout整合到这些中？

Answer 1

也有办法做它用delay()

$("#header .navigation li.menu-item-first a").mouseenter(function() { 
    $(".sub-nav").stop(true).css("display", "block"); //stop "animation" and clear queue 
}).mouseleave(function() { 
    $(".sub-nav").delay(1000).fadeOut(1); 
}); 

demo of usage

Answer 2

$("#header .navigation li.menu-item-first a").mouseenter(function() { 
    $(".sub-nav").css("display", "block"); 
}).mouseleave(function() { 
    window.setTimeout(function() { 
     $(".sub-nav").css("display", "none"); 
    }, 1000); 
}); 

也许吧？