サイズ変更が完了した後にのみ JQuery RESIZE イベントをトリガーする方法は?

サイズ変更が完了した後にのみ JQuery RESIZE イベントを呼び出す

JQuery のサイズ変更イベントを使用する場合、多くの場合、サイズ変更が完了した後でのみアクションを実行することが望ましいです。継続的なサイズ変更中ではなく、サイズ変更が終了しました。これは、過剰な関数呼び出しを避けるために特に重要です。

これを実現するには、次のアプローチを利用できます:

1. タイムアウトを設定します:

   事前に設定した遅延後に関数をトリガーするタイムアウトを作成し、サイズ変更が行われた場合にのみ関数が発生するようにします。

   $(window).resize(function() {
     clearTimeout(timer); // Reset any existing timeout
     timer = setTimeout(function() {
       // Your function goes here
     }, 300); // Set a 300ms delay
   });

2. ブール型フラグを使用します:

   サイズ変更が進行中かどうかを示すフラグを維持します。サイズ変更が開始されると、フラグを true に設定します。タイムアウトが経過したら、フラグを false に設定して、サイズ変更が完了したことを示します。

   var resizing = false;
   
   $(window).resize(function() {
     resizing = true; // Set flag to true when resizing starts
     setTimeout(function() {
       if (!resizing) return; // Ignore if resizing has already finished
       resizing = false; // Set flag to false when resizing finishes
       // Your function goes here
     }, 300); // Set a 300ms delay
   });

以上がサイズ変更が完了した後にのみ JQuery RESIZE イベントをトリガーする方法は?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。