Comment déclencher un événement JQuery RESIZE uniquement une fois le redimensionnement terminé ?

Appel de l'événement JQuery RESIZE uniquement une fois le redimensionnement terminé

Lorsque vous travaillez avec l'événement de redimensionnement JQuery, il est souvent souhaitable d'effectuer une action seulement après le redimensionnement est terminé, plutôt que pendant un redimensionnement continu. Ceci est particulièrement important pour éviter les appels de fonctions excessifs.

Pour y parvenir, vous pouvez utiliser l'approche suivante :

1. Définir un délai d'attente :

   Créez un délai d'attente qui déclenche la fonction après un délai prédéterminé, en vous assurant qu'elle ne se produit que lorsque le redimensionnement est terminé. stabilisé.

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

2. Utiliser un indicateur booléen :

   Maintenir un indicateur pour indiquer si le redimensionnement est en cours. Lorsque le redimensionnement commence, définissez l'indicateur sur true. Une fois le délai expiré, définissez l'indicateur sur false, indiquant que le redimensionnement est terminé.

   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
   });

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!