第7回 エフェクト編：連載：jQuery逆引きリファレンス（17/19 ページ）
「アニメーション効果を指定順に実行するには？」でも見たように、animateメソッドをメソッド・チェーンで連結した場合、アニメーションは指定順に実行されるのがデフォルトの挙動です。しかし、animateメソッドの引数optionsでqueueキーをfalseに設定することで、アニメーションはキュー（＝待ち行列）に追加されず、そのまま実行されます（つまり、すべてのアニメーションが並列に実行されます）。
具体的な例を見てみましょう。以下は、指定されたアイコン画像を5秒（＝5000ミリ秒）かけて600×400にリサイズ、また、半透明にする例です。animateメソッドをメソッド・チェーンで複数回に分けて呼び出しているにもかかわらず、それぞれで指定されたアニメーションは（“順番に”ではなく）並列に実行されることを確認してください。
<script type="text/javascript">
$(function() {
$('img')
.animate({ height: "400px", width: "600px" },
{
duration: 3000,
queue: false
}
).animate({ opacity: 0.5 },
{
duration: 3000,
queue: false
}
);
});
</script>
……中略……
<img src="http://www.wings.msn.to/books/978-4-7981-1957-1/978-4-7981-1957-1_logo.jpg" alt="ASP.NET" />
このHTMLを実際にブラウザで開く
queueキーを削除（コメントアウト）するか、値をtrueに変更することで、リサイズ、半透明化のアニメーションが同時にではなく、順に実行されることも確認してください。
Copyright© Digital Advantage Corp. All Rights Reserved.
ITmediaはアイティメディア株式会社の登録商標です。