第7回 エフェクト編：連載：jQuery逆引きリファレンス（1/19 ページ）

jQueryの大きな特徴の1つは簡単なコードで実現可能なさまざまなアニメーションだ。アニメーション用メソッドをまとめた、すぐに役立つ18本を一挙公開。

[山田祥寛（http://www.wings.msn.to/），著]

　

連載目次

　このシリーズでは、jQueryの基本機能を逆引きリファレンスの形式でまとめています。リファレンスという性質上、本連載では入門レベルでの解説は割愛しています。jQueryの基本構文、Visual Studio上でjQueryを利用する方法などについては、拙稿「ASP.NETプログラマーのためのjQuery入門」を併せて参照することをお勧めします。

　さて、本連載も第7回となる今回は、エフェクト編です。特定の要素セットに対して、視覚的なアニメーション効果を適用するためのメソッドについて解説します。

• 非表示状態の要素を表示状態にするには？
  − show([speed [,fnc]]) −
• 表示状態の要素を非表示状態にするには？
  − hide([speed [,fnc]]) −
• 要素の表示／非表示を交互に切り替えるには？
  − toggle([speed [,fnc]]) −
• 要素の表示／非表示を特定の条件で切り替えるには？
  − toggle(switch) −
• スライドダウン効果を適用するには？
  − slideDown(speed [,fnc]) −
• スライドアップ効果を適用するには？
  − slideUp(speed [,fnc]) −
• スライドアップ／スライドダウンを交互に行うには？
  − slideToggle([speed [,fnc]]) −
• フェードイン効果を適用するには？
  − fadeIn(speed [,fnc]) −
• フェードアウト効果を適用するには？
  − fadeOut(speed [,fnc]) −
• 要素の透明度を徐々に変化させるには？
  − fadeTo(speed, opacity [,fnc]) −
• 独自のアニメーション効果を適用するには？
  − animate(params [,speed] [,easing] [,fnc]) −
• アニメーション効果を指定順に実行するには？
  − animate(params [,speed] [,easing] [,fnc]) −
• アニメーションの変化の程度を調整するには？
  − animate(params [,speed] [,easing] [,fnc]) −
• アニメーションにかかわるオプションをハッシュ形式で指定するには？
  − animate(params, options) −
• アニメーションの処理ステップごとに処理を実行するには？
  − animate(params, options) −
• アニメーションを順次／並行いずれで実行するかを決めるには？
  − animate(params, options) −
• アニメーションの変化量をスタイル・プロパティの単位に設定するには？
  − animate(params, options) ［1.4］ −
• スクリプト全体のアニメーション効果を無効化するには？
  − $.fx.off −

---

　以上、エフェクト編では、組み込みのアニメーションであるスライドダウン／スライドアップ、フェードアウト／フェードインなどに始まり、自分で独自のアニメーションを定義する方法についてまとめました。次回は、Ajax機能を実装するための機能について紹介の予定です。