エフェクト

.animate()メソッドを連続して実行すると、それぞれのアニメーション効果は「キュー（queue）」に登録され、順に実行されます。キューはDOM要素ごとに１つまたは複数持てますが、複数のキューが必要になることはほとんどないでしょう。jQueryでは、特に指定しない限り、視覚効果には「fx」という名前のキューを使用します。.queue()メソッドは、引数を省略、またはキュー名だけを指定した場合、...

実行中のアニメーションを停止します。第1引数は、fxキューをクリアするかどうかをtrueまたはfalseで指定します。trueを指定すると、fxキューに登録されている他のアニメーション効果もクリアされ、実行されなくなります。第2引数は、アニメーションを完了させるかどうかをtrueまたはfalseで指定します。trueを指定すると、停止と同時に各CSSプロパティの値がアニメーションの最終的な到達点に...

animate()は、数値で指定可能なCSSプロパティを使い、独自の視覚効果を作成できる汎用的なメソッドです。まず、第1引数には変化させるCSSプロパティの名前と最終的に到達する値を、連想配列の形で指定します。ここで使用できるのは、あくまでも「数値」で指定できるプロパティだけやtext-decorationなどは指定できません。つまり、widthやheight,leftやrightなどは使用可能で...

引数なしで実行された場合、.show()メソッドは隠された要素を直ちに表示します。反対に、.hide()メソッドは直ちに隠します。.show()メソッドは、displayプロパティがblockに設定されたものと同様であり、初期値がどのような値であったとしても復元できます。もともとdisplayプロパティがinlineに設定されていた要素が隠されていた要素が隠された後に.show()で表示された場合...

.slideUp()は、要素の高さを元の高さから0まで徐々に変化させます。逆に.slideDown()は、要素の高さを0から元の高さまで徐々に変化させます。.slideToggle()は、要素が表示されているかどうかによって.slideUP()または.slideDown()のいずれかの効果を実行します。例えば、対象要素がスライドアップしている状態であれば.slideDown()、スライドダウンして...

.feadeIn()は、対象要素に対し徐々に表示を濃くするアニメーション効果を設定します。.fadeOut()は、その反対に徐々に表示を薄くします。.fadeTo()は第２引数で指定した「透明度」の値まで、徐々にfadeIn/fadeOutを行います。これらの関数の第1引数は、アニメーション効果にかける時間です。「fast（速く）」「slow（遅く）」といった文字列での指定の他、ミリ秒単位の数値で...

jQueryでは、アニメーション効果のオン・オフをグローバルなプロパティ「jQuery.fx.off」の値だけで制御できます。jQuery.fx.offにtrueを設定すると、その時点からすべてのアニメーション効果が一切効かなくなります。逆に、falseを設定すればいつでもアニメーション効果を復活させられます。また、「jQuery.fx.off」の「jQuery」の部分は「$」の文字に置き換えが可...