jQuery/JS setTimeout/clearTimeout

Question

我不是很精通這個，但我有一個導航項目，在懸停時，帶有搜索表單的div滑落。目前，當你鼠標懸停，然後鼠標懸停，div保持打開，直到你點擊關閉按鈕。

我試圖讓你在幾秒鐘後鼠標滑過div滑動備份，除非用戶仍然在div或nav鏈接上（即他們正在填寫搜索表單）。

這是我到目前爲止有：

$("#services_link").mouseover(function() { 
     $("#services_link").css('background-position','left -73px'); 
     $("#vendors_dropdown").slideDown(function() { 
      setTimeout(HideMe, 4000); 
     }); 
    }); 

    function HideMe() { 
     $("#services_link").css('background-position','left 0'); 
     $("#vendors_dropdown").slideUp(); 
    } 

這讓我作爲var當成股利滑下鏈接的懸停，4秒後，向上滑動（無論在哪裏，鼠標光標）。所以我只需要div保持打開，如果鼠標光標在鏈接或div上。

我看了3或4個其他類似的問題（和答案），沒有真正相當的伎倆。 setTimeout（和clearTimeout）對我來說有點新，所以請原諒noob問題。 :)

Answer 1

綁定mouseenter和mouseleave。您需要在mouseleave上執行超時，但如果鼠標再次發生，則會重置它。

試着看着選定的答案here看看我在說什麼。

事情是這樣的：

var timeout; 
$("#services_link, #vendors_dropdown").mouseenter(function() { 
    window.clearTimeout(timeout); 
    $("#services_link").css('background-position','left -73px'); 
    $("#vendors_dropdown").slideDown(); 
}).mouseleave(function(){ 
    timeout = window.setTimeout(HideMe, 4000); 
}); 

function HideMe() { 
    $("#services_link").css('background-position','left 0'); 
    $("#vendors_dropdown").slideUp(); 
}