ホームページ > ウェブフロントエンド > jsチュートリアル > jquery_jquery での一般的な特殊効果メソッドの使用例

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

WBOY
リリース: 2016-05-16 16:51:24
オリジナル
1235 人が閲覧しました

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","re​​d").slideUp(2000).slideDown(2000);

関連ラベル:
ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
最新の問題
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート