jQuery 基礎チュートリアル

jQuery エフェクト

slideUp()メソッドはスライドで選択された要素を隠します。

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

このメソッドは通常、slideDown()方法を組み合わせて使用します。

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

「#my-Div”をクリックすると、この例ではページ上で「.panel」を非表示にする：

例

$("#my-Div").click(function(){
　　$(".panel").slideUp();
});

ボタンをクリックしたとき、すべての<p>要素を上にスライドする：

例

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

使用durationパラメータ：

例

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

使用callbackパラメータ：

例

$("button").click(function(){
　　$("div").slideUp(1500, function(){
　　　　alert("上にスライド完了!");
　　});
});

すべての「.panel」を緩やかな持続時間と線形エイジングで上にスライドする：

例

$("#my-Div").click(function(){
　　$(".panel").slideUp("slow", "linear");
});

すべての範囲（この例では単語）をアニメーションで速くスライドして、200ミリ秒内に各アニメーションを完了します：

例

$("button").click(function(){
　　$("span:last-child").slideUp("fast",　function(){
　　　　$(this).prev().slideUp("fast",　arguments.callee);
　　});
});

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