javascript - jQuery 如何在从 DOM 中删除 float 跨度后为 float 跨度设置动画？

Question

假设我有 4 <span/> (或 div，随便什么)

[1] [2] [3] [4]

每个容器内部都有一个输入，这会导致它的容器从 DOM 中删除。

如果我点击容器 [2] 中的输入，它会被移除并且容器 [3] 和 [4] 会立即向左移动:

[1] [3] [4]

我想知道如何为该过程设置动画 - 让它慢一点？

Answer 1

这取决于您的 CSS。

如果它们向左浮动，那么您所要做的就是在删除它之前将 #2 的宽度设置为 0。

示例: http://jsfiddle.net/a6NPP/

$(myspan).animate({width:0}, 600, function() { $(this).remove(); });

这假设没有边框/填充/边距。如果是这样，您还需要为它们的左/右属性设置动画，或者将每个属性放在一个带有 overflow:hidden 的容器中，并为其宽度设置动画。

---

编辑:如果您想使用 jQueryUI , 它有 many effects you can use .