jquery停止動畫，如果另一個仍在運行

我試圖顯示和隱藏懸停元素上的元素。我的代碼工作，但是當用戶鼠標懸停及移出元素非常快，動畫就跑甚至鼠標移開它:(jquery停止動畫，如果另一個仍在運行

$('.EventNameList').hover(
    function() { 
     $(this).stop().animate({ backgroundColor: '#eaeaea' }, 200, "easeInQuad"); 
     $(this).find('div#TrainingActionButtons').show("fast"); 
    }, 
    function() { 
     $(this).stop().animate({ backgroundColor: '#ffffff' }, 800, "easeOutQuad"); 
     $(this).find('div#TrainingActionButtons').hide("fast");   
    }); 
    });

和HTML：

<tr> 
<td class="EventNameList"> 
    <div id="TrainingActionButtons"> 
    Some text 
    </div> 
    </td> 
</tr>

來源

2011-01-14 user575900

可能重複：http://stackoverflow.com/questions/4666227/jquery-issue-with-hoverintent-and-show-hide-for-div/4667207#4667207 – ifaour 2011-01-14 17:05:04

我不知道這方面的表現，但可以告訴所有元素停止並結束，而不僅僅是當前元素。

$('.EventNameList').hover(
    function() { 
     // stop([clearqueue], [jumpToEnd]) 
     $('.EventNameList').stop(true, true); 
     $(this).animate({ backgroundColor: '#eaeaea' }, 200, "easeInQuad"); 
     $(this).find('div#TrainingActionButtons').show("fast"); 
    }, 
    function() { 
     $(this).stop().animate({ backgroundColor: '#ffffff' }, 800, "easeOutQuad"); 
     $(this).find('div#TrainingActionButtons').hide("fast");   
    }); 
});

來源

2011-01-14 17:00:06

感謝快速反應:)我使用此代碼$（this）.find（'div＃TrainingActionButtons'）。stop（true，true）; 和我的作品完美 – user575900 2011-01-15 17:19:38

你可以嘗試調用stop(true,true) - 這將清零效果隊列並跳到當前正在運行的動畫的結尾Read more about it here

來源

2011-01-14 16:52:00

jquery停止動畫，如果另一個仍在運行

回答

相關問題