fadeTo .attr源的變化，雖然第一之前執行

Question

下面是一段代碼：

$(document).ready(function() { 
    $('#nextBtn').live('click', 
    function() { 
     $(this).attr('id', 'next2Btn') 
     $('#cs_contentToSlide').animate({ 
      left: '-=500', 
     }, 
     200, 
     function() { 
      $('#stateGraphic').attr('src', 'images/state2_3stage.gif'); 
      $('#mainGraphic').fadeTo(900, 0.10); 
    $('#mainGraphic').attr('src', 'images/assess3.gif'); 
    $('#mainGraphic').fadeTo(300, 1.0);   }); 

    }); 
}); 

我不明白，爲什麼在#mainGraphic的.attr編輯它之前在源淡入淡出之前發生訂購。

應該發生的事情是：點擊，幻燈片，＃主圖形淡入淡出，被替換，然後淡出。

事實上，我點擊幻燈片，然後#mainGraphic被替換，然後淡入/淡出。

看起來.attr的變化更加高級以至於淡化？

Answer 1

.attr()更改不是FX隊列的一部分，因此它們與效果異步發生。

一個選項是調用.fadeTo()回調中的.attr()更改。

... 
$'#mainGraphic'.fadeTo(900, 0.10, function(){ 
    $(this).attr('src', 'images/assess3.gif'); 
}) 
.fadeTo(300, 1.0); 
});