jquery - 新しいdivにアニメーション化するjQuery

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 内に配置するキャラクター 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();