jquery - jQuery 动画到一个新的 div

Question

我有几个 div 设置。

<div class="terrain water"></div>

<div class="terrain water"></div>

<div class="terrain water"></div>

<div class="terrain water"></div>

每个 div 代表宽度：32px 高度：32px 的“图块”。我还有一个角色 div 放置在 tile div 内。

<div class="terrain water"><div class="character"></div></div>

当我想将角色 div 移动到另一个 div 时，我也想制作动画。我怎样才能做到这一点？

Answer 1

您可以先将角色 div 的不透明度设置为 0，移动它，然后在将其附加到其他 div 后将其设置为 1。这将产生消失出现的效果。

$(".character").animate({"opacity":0}, 1000).appendTo("Your other div").animate({"opacity":1},1000);

Answer 2

您可以使用淡入淡出效果为角色设置动画。

$(".character").fadeOut().appendTo("Your other div").fadeIn();