jqueryでstop()を使用する方法について話しましょう

jQuery は強力な JavaScript ライブラリであり、Web ページでさまざまなインタラクティブ効果、アニメーション効果などを処理するためによく使用されます。これらの操作中に、進行中のアニメーション効果を一時停止または停止する必要がある場合がありますが、この場合は、jQuery の stop メソッドを使用できます。

stop メソッドの使用法

jQuery では、stop メソッドは、現在の DOM 要素で進行中のアニメーション効果を停止するために使用されます。その構文形式は次のとおりです:

$(selector).stop(stopAll, goToEnd);

このうち、セレクターは停止する必要がある DOM 要素セレクターを表し、stopAll はキュー内のすべてのアニメーション効果を停止するかどうかを示すオプションのパラメーターです。デフォルト値は false です。は、現在アクティブなアニメーションを停止するだけです。goToEnd もオプションのパラメーターで、現在のアニメーションの最終状態に直接ジャンプするかどうかを示します。デフォルト値は false で、アニメーション効果を徐々に停止します。

たとえば、DOM 要素 $("#myElem") で実行中のアニメーション効果を停止する必要がある場合、コードは次のとおりです。

$("#myElem").stop();

このコードでは、 stop メソッド実行中のアニメーション効果は直接停止され、現在のアニメーション効果が終了した後は、他のアニメーション効果は実行されません。

要素のすべてのキューでアニメーション効果を停止する必要がある場合、コードは次のとおりです:

$("#myElem").stop(true);

このコードでは、stop メソッドの stopAll パラメーターが true に設定されます。これは、現在の要素のすべてのキューを停止することを意味します。アニメーション効果。

キュー内のすべてのアニメーション効果を停止し、最終状態に直接ジャンプする必要がある場合、コードは次のとおりです。

$("#myElem").stop(true, true);

このコードでは、stop メソッドの goToEnd パラメータは次のとおりです。 true に設定すると、すべてのキューが停止され、アニメーション効果が発生し、最終状態に直接ジャンプします。

stop メソッドの高度な使用法

stop メソッドは、要素に対する複数のアニメーション効果を処理するために適用することもできます。この場合、stop メソッドの内部実装は上記の使用法とは少し異なります。複数のアニメーション効果が DOM 要素で同時に実行される場合は、次のコードを使用してアニメーション効果の 1 つを停止することを検討できます。

$("#myElem").stop("propertyName");

このコードでは、propertyName はアニメーション効果の名前を表します。停止する必要があります。これには次のタイプが含まれます:

• "queueName": キュー内のすべてのアニメーション効果を停止します。
• "fx": 現在の (jQuery.fx) オブジェクトのすべてのアニメーション効果を停止します。
• アニメーション効果を定義するために使用される名前 (「不透明度」、「幅」、「高さ」など)。

同様に、特定の要素に対するすべてのアニメーション効果を同時に停止する必要がある場合、コードは次のようになります。

$(".myElems").stop(false, true);

このコードでは、停止時のデフォルトの動作が決まります。メソッドは呼び出されません。現在アクティブなアニメーション効果のみを停止します。これらの要素のすべてのアニメーション効果を停止するには、stopAll パラメーターを true に設定します。

結論

この記事の導入部を通じて、jQuery の stop メソッドの基本的な使用法と、いくつかの高度な使用法の実装について学びました。アニメーション効果の処理中、停止または一時停止する必要がある一部の効果に対して stop メソッドを使用すると非常に便利で効率的です。ただし、stop メソッドを使用するときは正しいパラメータを使用するように注意する必要があります。そうしないと、アニメーション効果全体の動作に影響します。

以上がjqueryでstop()を使用する方法について話しましょうの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。