淡化项目并删除后的动画列表

Question

例如我们有这样的HTML代码：

<ul>
    <li id="1">1</li>
    <li id="2">2</li>
    <li id="3">3</li>
    <li id="4">4</li>
</ul>

和这样的js

$('#1').fadeOut().remove();

退出后，剩余物品同时向上移动。有可能让这个动起来吗？

Answer 1

使用animate淡化不透明度，然后在淡入淡出完成后使用回调执行slideUp()。

$('#1').animate({ 'opacity': 0 }, 1000, function() {
    $(this).slideUp();
})

Example fiddle