ホームページ >ウェブフロントエンド >jsチュートリアル >jQueryでウィンドウのサイズ変更が完了した後に関数をトリガーするにはどうすればよいですか?

jQueryでウィンドウのサイズ変更が完了した後に関数をトリガーするにはどうすればよいですか?

Linda Hamilton
Linda Hamiltonオリジナル
2024-11-12 03:07:02321ブラウズ

How to Trigger a Function After Window Resize Completion in jQuery?

JQuery: 完了時のサイズ変更イベントのキャプチャ

jQuery のサイズ変更イベントはウィンドウのサイズ変更中に継続的にトリガーされる可能性があり、パフォーマンスの問題が発生します。これに対処するために、サイズ変更が完了した後にのみ関数を呼び出すことを目指しています。

間隔操作を使用した解決策:

jh が提案しているように、setInterval 関数を活用できます。ブラウザのサイズ変更が完了したかどうかを定期的に確認します。非アクティブを検出すると、間隔をクリアして目的の関数を呼び出すことができます。

var resizeTimer;

$(window).resize(function() {
  // Reset the resize timer if it exists
  if (resizeTimer) clearTimeout(resizeTimer);

  // Set a new resize timer
  resizeTimer = setTimeout(function() {
    // Call the desired function here
  }, 30);
});

このソリューションでは、clearTimeout を使用して既存のサイズ変更タイマーをキャンセルします。次に、短い間隔 (この例では 30 ミリ秒) で新しいタイマーを設定します。タイマーが経過すると、サイズ変更が終了したことがわかり、目的の機能を実行できます。

以上がjQueryでウィンドウのサイズ変更が完了した後に関数をトリガーするにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。