2014-09-05 89 views
0

我試圖關閉我之前附加到主體的通知面板。.animate()和.remove()不能很好地結合在一起

$('#notify-panel').animate({top: -250},{duration: 1000, easing: 'easeInOutBack'}); 

這本身,效果很好,但我的目標是,所以我加了一個.remove()語句中的動畫完成後刪除其移動DIV對象。

$('#notify-panel').animate({top: -250},{duration: 1000, easing: 'easeInOutBack'}); 
$('#notify-panel').remove(); 

當我運行這個,面板被刪除從身體但動畫不會執行,圖層不見了。所以我添加了.remove()作爲回調的一部分。

$('#notify-panel').animate({top: -250},{duration: 1000, easing: 'easeInOutBack'}, {callback: function(){ $(this).remove(); }}); 

這個網狀結構與之前的步驟一樣,其中圖層從未被動畫移除過。所以我的問題是,如果我想動畫一個div層然後將其刪除,我將如何去做。顯然,我做錯了什麼。

+0

了jQuery UI的頁面上的例子做好demoing這一切的東西......這是什麼你做這些例子不能解決? – ControlAltDel 2014-09-05 17:48:57

回答

3

這可能是由reading the manual解決。使用以下之一:

$('#notify-panel').animate({ 
    top: -250 
}, { 
    duration: 1000, 
    easing: 'easeInOutBack', 
    complete: function() { 
     $(this).remove(); 
    } 
}); 

或者:

$('#notify-panel').animate({ 
    top: -250 
}, { 
    duration: 1000, 
    easing: 'easeInOutBack' 
}, function() { 
    $(this).remove(); 
}); 
1

其中之一,你錯過了值和px的引號。

我會寫這樣的:

$('#notify-panel').animate({ 
    top: '-250px' 
}, { 
    easing: 'easeInOutBack' 
}, 1000, function() { 
    $(this).remove(); 
}); 
+0

'px'不是必需的。 – 2014-09-05 17:49:27

+0

你在混合編寫'.animate()'的兩種方式,你確定它工作嗎? – 2014-09-05 17:49:27

相關問題