中的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); 
}); 

也許吧？