用detach淡入/淡出（）

Question

我寫了一個簡單的函數來在列表單擊時滾動單詞列表。我想嘗試使這種淡入/淡出，但使用jQuery方法會導致一些關閉行爲。沒有淡入代碼輸入/輸出是：

function wordSlide(){ 
    var mover; 
    $('.wordslide').click(function(){ 
     mover = $('li',this).first().detach(); 
     mover.appendTo('.wordslide',this); 
    }); 
} 

與一些CSS：

.wordslide li { 
    display: none; 
} 

.wordslide li:first-of-type { 
    display: block; 
} 

我試着將淡出以下行：

mover = $('li',this).first().detach(); 

但這無法正常工作預期。任何想法都非常感謝。

Answer 1

使用淡出的完整事件：

.fadeOut([duration ] [, complete ]) 

例如

$('li',this).first().fadeOut(400, function(){ $(this).detach(); }); 

下面以實例爲https://jsfiddle.net/nup92o3m/3/小提琴：

<div id="myDiv" style="background-color: red; width: 100px; height: 100px;"> 
</div> 
<div id="container" style="border: 1px solid black; width: 300px; height: 300px;"> 
</div> 
<script> 
$('document').ready(function(){ 
$('#myDiv').fadeOut(800, function() 
{ 
    var myDiv = $(this).detach(); 
    myDiv.appendTo('#container').fadeIn(800); 
});