jQuery エフェクト - slideToggle() メソッド

jQuery エフェクトリファレンスマニュアル

例

スライド効果を使用して、<p>要素の表示と非表示の状態を切り替えます：

$(".btn1").click(function(){
  $("p").slideToggle();
});

実際に試してみてください

定義と使用方法

slideToggle() メソッドはスライド効果（高さの変化）を使用して要素の可視状態を切り替えます。

選択された要素が可視の場合はこれらの要素を非表示にし、選択された要素が非表示の場合はこれらの要素を表示にします。

構文

$().slideToggle(speed,callback)
パラメータ 説明
speed

オプション。要素が非表示から表示へ、またはその逆の速度を指定します。デフォルトは "normal" です。

可能な値：

  • ミリ秒（例：1500）
  • "slow"
  • "normal"
  • "fast"

速度が設定されている場合、要素が切り替えの過程で次第に高さを変化させます（これによりスライド効果が作成されます）。
callback

オプション。toggle 関数が実行された後に行われる関数。

callback に関する詳細な情報を学びたい場合は、jQuery Callback という章を訪れてください。

speed パラメータが設定されていない場合、このパラメータを設定することはできません。

ヒントとコメント

ヒント：要素が既に非表示の場合、この効果は何も変更しません。callback 関数が指定されていない場合を除きます。

さらに多くの例

speed パラメータを使用して
speed パラメータを使用して、要素の上下スライド表示と非表示を切り替えます。

jQuery エフェクトリファレンスマニュアル