Jquery transit＆Mouseover

Question

我想使用腳本在鼠標懸停上創建一個過渡動畫：Transit 一切都完成了，好吧......只有一個例外。過渡是有效的，但如果你在3個不同的塊上多次通過鼠標（例如5次例證），動畫將繼續播放！它創造了閃爍的效果，但我不喜歡... 一張圖片勝過千言萬語：這是我的代碼和問題是：http://jsfiddle.net/u4Dk4/1/

感謝您的寶貴幫助。

$(function() { 
    $("#A").mouseover(function() { 
    $("#A").transition({ opacity: '0'}, 500);}); }); 
$(function() { 
    $("#A").mouseout(function(){ 
    $("#A").transition({ opacity: '1'}, 500);}); }); 

Answer 1

您創建了一個動畫隊列。使用stop()函數刪除該隊列。

Heres your altered Fiddle

$("#A").mouseover(function() { 
$("#A").stop().transition({ opacity: '0'}, 500);}); }); 
$(function() { 
$("#A").mouseout( 
function(){ 
$("#A").stop().transition({ opacity: '1'}, 500);}); });