如何在动画完成后删除元素？

我正在使用以下代码来动画div。

 $(function() { $("a.shift").click(function() { $("#introOverlay").animate({ height: 0, }, 2000) }); });  

当动画结束时，我想将其删除。 我怎样才能做到这一点？

Answer 1

animate需要2个参数，所以你可以这样做：

 $("a.shift") .click(function() { $("#introOverlay") .animate({height: 0}, 2000,"linear",function() { $(this).remove(); } ) } ); 

未经测试。

编辑：测试：这是我使用的整个页面，扩展到300px使删除更明显：

        clickme 
overlay
   

Answer 2

JQuery动画（params，[duration]，[easing]，[callback]）提供了添加每次动画完成时调用的回调的可能性

callback（可选）function：动画完成时要执行的函数，对每个动画元素执行一次。

语法几乎是简单的jQuery：

另见这个问题

Answer 3

将remove()调用放在效果队列中，如下所示：

 $("a.shift").click(function() { $("#introOverlay").animate({ height: 0, }, 2000); $("#introOverlay").queue(function() { $(this).remove(); $(this).dequeue(); }); }); 

Answer 4

使用window.timeout与动画所用的时间相同。