最新のWeb開発のチュートリアル
 

jQuery効果 - スライディング


jQueryのスライド方法は、上下の要素をスライドさせます。

/アップパネルスライドダウンするためにクリック

時間は貴重なものですので、私たちは迅速かつ簡単に学習を提供します。

w3iiでは、あなたがアクセス可能で、便利な形式で、あなたが学ぶために必要なすべてを学ぶことができます。


jQuery slideDown()
jQueryの実証slideDown()メソッドを。

jQuery slideUp()
jQueryの実証slideUp()メソッドを。

jQuery slideToggle()
jQueryの実証slideToggle()メソッドを。


jQueryのは、メソッドをスライディング

jQueryのを使用すると、要素上でスライド効果を作成することができます。

jQueryのは、次のスライドのメソッドがあります。

  • slideDown()
  • slideUp()
  • slideToggle()

jQueryのslideDown()メソッド

jQueryのslideDown()メソッドは、エレメントを下にスライドするために使用されます。

構文:

$(selector).slideDown(speed,callback);

オプションの速度パラメータは、効果の持続時間を指定します。 それは次の値を取ることができます: "slow", "fast" 、またはミリ秒。

オプションのコールバックパラメータは、スライド完了後に実行される機能です。

以下の実施例は、 slideDown()メソッドを:

$("#flip").click(function(){
    $("#panel").slideDown();
});
»それを自分で試してみてください

jQueryのslideUp()メソッド

jQueryのslideUp()メソッドは、エレメントを上にスライドするために使用されます。

構文:

$(selector).slideUp(speed,callback);

オプションの速度パラメータは、効果の持続時間を指定します。 それは次の値を取ることができます: "slow", "fast" 、またはミリ秒。

オプションのコールバックパラメータは、スライド完了後に実行される機能です。

以下の実施例は、 slideUp()メソッドを:

$("#flip").click(function(){
    $("#panel").slideUp();
});
»それを自分で試してみてください

jQueryのslideToggle()メソッド

jQueryのslideToggle()メソッドは、間で切り替わりますslideDown()slideUp()メソッド。

要素が滑り落ちてきた場合は、 slideToggle()それらをスライドさせます。

要素がアップにスライドされている場合は、 slideToggle() 、それらを下にスライドします。

$(selector).slideToggle(speed,callback);

オプションの速度パラメータは、以下の値を取ることができます: "slow", "fast" 、ミリ秒。

オプションのコールバックパラメータは、スライド完了後に実行される機能です。

次の例では、実証slideToggle()メソッドを:

$("#flip").click(function(){
    $("#panel").slideToggle();
});
»それを自分で試してみてください

練習で自分自身をテスト!

演習1» 演習2» 演習3» 演習4»


jQueryのエフェクトリファレンス

すべてのjQueryの効果の完全な概要については、当社をご覧くださいjQueryのエフェクトリファレンス