jQuery的動畫（{} textIndent）

我有這樣的片段：jQuery的動畫（{} textIndent）

$(document).ready(function(){ 
$(".sidebar .nav li a.animate").hover(function(){ 
    $(this).animate({textIndent:"133"}, "fast") 
}, function(){ 
    $(this).animate({textIndent:"27"}, "fast") 
}); 
});

基本上它的菜單項的動畫。它可以正常工作，但是如果您將鼠標從上到下並多次反轉，您可以注意到動畫仍在繼續運行中的令人討厭的延遲。

我該如何防止這種情況發生？在事件被觸發後我應該阻止事件嗎？解決這個問題的最好方法是什麼？ :)

代碼示例表示讚賞。

來源

2012-12-14 MultiformeIngegno

可能重複[？如何立即執行功能（http://stackoverflow.com/questions/13867939/how-to-execute-function-immediately） –

示例http://css-tricks.com/examples/jQueryStop/ – Kasun

添加一些stop()的：

$(document).ready(function(){ 
    $(".sidebar .nav li a.animate").on('mouseenter mouseleave', function(e){ 
     $(this).stop(true,true) 
       .animate({textIndent: e.type=='mouseenter' ? 133 : 27}, "fast") 
    }); 
});

的

來源

2012-12-14 00:42:44 adeneo

Uhm，這裏是您修改的片段： http://carminella.it/test2.php 這是一個更好的因爲stop（）工程，但如果你在元素之間傳遞得相當快，你可以看到動畫總是重新開始..有沒有辦法阻止或延緩其他動畫，以便沒有這種奇怪的感覺..？這很難解釋，只是嘗試在新的鏈接上懸停的元素:) 如果不能「修復」這種行爲，我會接受;） – MultiformeIngegno

嘗試擺弄選項（兩個真的），第一個clear的隊列和第二個跳轉到動畫的結尾，所以嘗試設置false值，並看到它，你可以通過這樣做來實現你想要的。 – adeneo

謝謝！成功了！ :) – MultiformeIngegno

jQuery的動畫（{} textIndent）

回答

相關問題