jquery_jquery での一般的な特殊効果メソッドの使用例-jsチュートリアル-php.cn

jquery_jquery での一般的な特殊効果メソッドの使用例

WBOY

リリース： 2016-05-16 16:51:24

オリジナル

1217 人が閲覧しました

1. jQuery fadeIn() は、非表示の要素をフェードインするために使用されます。

構文:

コードをコピーコードは次のとおりです:

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

例:

コードをコピーコードは次のとおりです:

$("button ").click(function(){
 $("#div1").fadeIn();
 $("#div2").fadeIn("slow");
 $("#div3 ").fadeIn(3000);
});

2. jQuery fadeOut() メソッドは、表示要素をフェードアウトするために使用されます。

構文:

コードをコピーコードは次のとおりです:

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

3． jQuery fadeToggle() メソッドは、fadeIn() メソッドと fadeOut() メソッドを切り替えます。

fadeToggle() は、要素がすでにフェードアウトしている場合に、要素にフェードイン効果を追加します。

要素がすでにフェードインしている場合、fadeToggle() は要素にフェードアウト効果を追加します。

構文:

コードをコピーコードは次のとおりです:

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

例: $("button").click(function(){
$("#div1").fadeToggle();
$("#div2").fadeToggle("slow") ;
$("#div3").fadeToggle(3000);
});

4.構文:

$(セレクター).fadeTo(速度,不透明度,コールバック);

必須の速度パラメーターは、エフェクトの持続時間を指定します。「slow」、「fast」、またはミリ秒の値を取ることができます。

fadeTo() メソッドの必須の不透明度パラメーターは、フェード効果を指定された不透明度 (0 から 1 までの値) に設定します。例

コードをコピーコードは次のとおりです。

$("button").click (関数( ){

$("#div1").fadeTo("slow",0.15);

$("#div2").fadeTo("slow",0.4);

$("#div3").fadeTo("slow",0.7);

});

5. jQuery slideDown() メソッドは要素を下にスライドさせるために使用されます。

構文:

コードをコピーコードは次のとおりです:

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

コードをコピーコードは次のとおりです:

$("#flip").click (function( ){
 $("#panel").slideDown();
});

6. jQuery slideUp() メソッドを使用して要素を上にスライドさせます。

構文:

コードをコピーコードは次のとおりです:

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

オプションのspeedパラメータは、エフェクトの持続時間を指定します。「slow」、「fast」、またはミリ秒の値を取ることができます。

オプションのコールバックパラメーターは、スライディングの完了後に実行される関数の名前です。

7. jQueryの slideToggle() メソッドは、slideDown() メソッドと slideUp() メソッドを切り替えることができます。

要素が下にスライドする場合、slideToggle() は要素を上にスライドさせます。

要素が上にスライドする場合、slideToggle() は要素を下にスライドします。

コードをコピーコードは次のとおりです。

$(selector).slideToggle(speed,コールバック);

8. jQuery animate() メソッドはカスタムアニメーションの作成に使用されます。

構文:

コードをコピーコードは次のとおりです:

$(selector) .animate( {params},speed,callback);

必須の params パラメータは、アニメーションを形成する CSS プロパティを定義します。

オプションの速度パラメーターは、エフェクトの持続時間を指定します。「slow」、「fast」、またはミリ秒の値を取ることができます。

オプションのコールバックパラメーターは、アニメーションの完了後に実行される関数の名前です。

相対値を定義することもできます (値は要素の現在の値に対する相対値です)。値の前に = または -= を追加する必要があります:

アニメーションのグループを定義してキュー機能を実装することもできます。

次の例は、animate() メソッドの簡単なアプリケーションを示しています。

は、left 属性が 250 ピクセルになるまで、

要素を左に移動します。

例

コードをコピーコードは次のとおりです。

$("button" ).click (function(){
 $("div").animate({left:'250px'});
});

9. jQuery stop() メソッドは、アニメーションやエフェクトが完了する前に停止するために使用されます 

10. アニメーションが 100% 完了したら、Callback 関数を呼び出します。

一般的な構文:

コードをコピーコードは次のとおりです: $(selector ).非表示(速度,コールバック)

11. jQueryメソッドリンク

一部の要素は一度だけ取得する必要があるため、リンクを使用してメソッドを追加できます。

メソッドポイントメソッドです。たとえば、

コードをコピーコードは次のとおりです。$("#p1" ).css(" color","red").slideUp(2000).slideDown(2000);