jQuery UI の toggle を使いアニメーション動作で表示/非表示

jQuery UI の toggle プラグインについて。toggle() の 1つ目の引数は、アニメーション動作の種類。2つ目の引数は、1つ目の引数に指定したアニメーション動作固有のオプション。3つ目の引数はアニメーション動作速度。4つ目の引数は、アニメーション動作後に呼び出す関数。

１つ目の引数に指定するアニメーション動作は、'blind'、'bounce'、'clip'、'drop'、'explode'、'fade'、'fold'、'highlight'、'puff'、'pulsate'、'scale'、'shake'、'slide'のいづれか。

実装例（サンプル）

表示 / 非表示

実装例（サンプル）について

実装例（サンプル）は、１つ目の引数に「blind」を指定して、ブラインドを開閉するようなアニメーション動作で、ボックスの表示/非表示を切り替えるようにしたもの。

実装例（サンプル）のソースコードについては、こちら。

toggle プラグイン

概要

toggle( effect, [options], [speed], [callback] )

effect

1つ目の引数。

アニメーション動作の種類を指定する。

指定できる値

• blind
• bounce
• clip
• drop

• explode
• fade
• fold
• highlight

• puff
• pulsate
• scale
• shake

• slide

options

2つ目の引数。

1つ目の引数に指定したアニメーション動作固有のオプション。

speed

3つ目の引数。

アニメーション動作速度。

callback

4つ目の引数。

アニメーション動作後に呼び出す関数。