jQueryの基本チュートリアル

jQueryの効果

toggle()メソッドはhide()およびshow()メソッド間で切り替えます。

このメソッドは選択された要素の可視性を確認します：

注意：非表示の要素はページのレイアウトに影響を与えなくなります。

$(selector).toggle(duration, easing, callback)

ボタンをクリックしたときに、すべての<p>要素のhideとshowの間で切り替えます：

例

$("button").click(function(){
　　$("p").toggle();
});

使用durationパラメータ：

例

$("button").click(function(){
　　$("p").toggle();1500);
});

使用callbackパラメータ：

例

$("button").click(function(){
　　$("div").toggle();1500, function(){
　　　　alert("toggle（）効果完了!!!");
　　});
});

すべてのスパン（例えば、単語）にアニメーションを作成して迅速に非表示にします/表示し、200ミリ秒以内に各アニメーションを完了：

例

$("button").click(function(){
　　$("span:first-child").toggle("fast",　function(){
　　　　$(this).next().toggle("fast",　arguments.callee);
　　});
});

パラメータ	説明
duration	（オプション）非表示を決定する/表示効果がどれくらいの長さで実行されるか。プリセット値は400ミリ秒可能な値：ミリ秒（例えば100、500、2000など）「fast」「slow」
easing	（オプション）アニメーションの異なるポイントで要素の速度を指定する文字列。デフォルト値は「swing」可能な値：「swing」-始めに/終わりに近づくと動きが遅くなり、中間では速くなります「linear」-恒定速度で動く
callback	（オプション）toggle()メソッドが完了した後に呼び出される関数、各選択された要素ごとに一度呼び出されます