Jquery fadeOut沒有動畫

任何人都可以看到爲什麼這段代碼不顯示動畫？我可以在Chrome中看到動畫正確地發生（在F12工具中，我看到動畫正在發生，並且divs正在切換）。所以代碼正在工作，但我沒有看到主圖像是動畫的 - 當remove（）被調用時它就會消失，並且當發生這種情況時會立即顯示下一個圖像。Jquery fadeOut沒有動畫

我檢查了IE10和Chrome，它們都做同樣的事情。我也嘗試過使用animate（'opacity'）和相同的結果。

我看不見它，但我猜這是簡單的東西我只是想念，因爲我一直在看它太久了！

感謝您的幫助。

腳本：

function fader(){ 
    $('#fader div:first').fadeOut(600,function() { 
     $('#fader').append('<div class="faderitem">'+$('#fader div:first').html()+'</div>'); 
     $('#fader div:first').remove(); 
     setTimeout('fader()',6000); 
    }); 
}

的CSS：

#fader { 
    width:620px; 
    height:620px; 
    position:relative; 
} 
#fader div.faderitem { 
    width:620px; 
    height:620px; 
    position:absolute; 
    top:0; 
    left:0; 
}

和HTML：

<div id="fader"> 
    <div class="faderitem"><img src="/images/scroller/26-a.jpg" alt="" width="620" height="620" /></div> 
    <div class="faderitem"><img src="/images/scroller/26-b.jpg" alt="" width="620" height="620" /></div> 
    <div class="faderitem"><img src="/images/scroller/26-c.jpg" alt="" width="620" height="620" /></div> 
</div>

來源

2013-05-01 Mark King

我從來沒有見過傳遞該函數作爲setTimeout的字符串。你確定這有用嗎？我會做'setTimeout（推子，6000）;' – 2013-05-01 23:56:16

這無非是因爲Z-指數。你看，你使推子的第一個孩子動起來，那是在其他人的後面。

只需添加的CSS，它應該工作後：

#fader.faderitem:nth-child(1){ 
    z-index : 2 
} 
#fader.faderitem:nth-child(2){ 
    z-index : 1 
}

編輯：歐文Masback mentionned，設置超時的好方法是這樣的：setTimeout(fader,6000);

來源

2013-05-01 23:56:14

Thanks.I使我的功能，現在都很好。（'＃fader div.faderitem：nth-child（1）'）。css（'z-index'，2）;}函數推子（）{ \t $ \t $（'＃fader div.faderitem：n-child（2）'）。css（'z-index'，1）; 。 \t $（ '＃推子DIV：第一'）淡出（2000，函數（）{ \t \t $（ '＃推子'）附加（」

'+$('#fader div:first').html()+'

'）; \t \t $（' ＃推子DIV：（）; \t}）; }' – 2013-05-02 00:15:35

Jquery fadeOut沒有動畫

回答

相關問題