jQuery在鼠標懸停時暫停延遲計時器

我目前正在學習MVC3，並在學習過程中一直在我的項目中添加幾個jQuery腳本，試圖同時學習這些腳本。事情進展順利，但在這種情況下，我似乎無法弄清楚我必須做些什麼來實現我想要的功能。jQuery在鼠標懸停時暫停延遲計時器

我在this Fiddle中創建了相關代碼的示例，而不是將代碼寫在這裏的幾個代碼塊中。

我的代碼中發生的事情是，當按下按鈕時，消息div從左側滑出，3秒後它將再次滑開。如果用戶在滑出時將鼠標放在消息div上，則會添加消息。

這幾乎是我想要除了一小部分之外;當用戶將鼠標放在消息div上時，我希望它保持打開狀態，直到它們將鼠標移開，然後它將滑回，目前它在3秒鐘後仍會滑落。

我嘗試過移動.delay，將代碼添加到mouseout()事件中，但我對jQuery的知識缺乏幾乎停止了我的進度。

任何人都可以解釋如何做到這一點和/或指向我的一些例子。

非常感謝。

來源

2012-09-19 XN16

既然你調用明確（因此3秒延遲）在顯示功能，那麼我建議以下鼠標懸停/鼠標移開處理：

$("#messageWrapper").mouseover(function() { 
    $("#testlabel").text("mouseover"); 
    $("#messageWrapper").css('width', 'auto'); 
    $("#messageWrapper .messageBox").text(something); 
    $(this).clearQueue(); 
}).mouseout(function() { 
    $("#testlabel").text("mouseout"); 
    clearMessages(); 
});

編輯小提琴：http://jsfiddle.net/vypTA/7/ - 想你可以捏捏清除延遲（通過它作爲參數或東西）

來源

2012-09-19 11:50:39

這正是我想要的！謝謝。我猜這個關鍵是'clearQueue（）'函數，我認爲它實際上取消了已經從'displayMessages（）'函數中調用的已經調用的'clearMessages（）'？ – XN16

它清除動畫隊列（您的隱藏呼叫已經在那裏，延遲時間到了）。 API參考：http：//api.jquery.com/clearQueue/ –

是this你想實現什麼？

$("#messageWrapper").mouseover(function() { 
    $("#testlabel").text("mouseover"); 
    $("#messageWrapper").css('width', 'auto'); 
    $("#messageWrapper .messageBox").text(something); 
    $("#messageWrapper").stop(); // added this line 
}).mouseout(function() { 
    $("#testlabel").text("mouseout"); 
    clearMessages(); // added this line 
});

來源

2012-09-19 11:45:52

這個答案適合你嗎？ –

如果我理解正確，那麼當您將鼠標懸停在添加的文本上時，您希望div保持打開狀態，並且將鼠標滑出時向左滑動。這就是它對我的作用.. –

jQuery在鼠標懸停時暫停延遲計時器

回答

相關問題