Comment puis-je faire en sorte que la fonction d'événement « resize » de jQuery ne s'exécute qu'une seule fois après le redimensionnement ?

Appel de l'événement jQuery RESIZE une seule fois après le redimensionnement

Lorsque vous travaillez avec la fonction d'événement de redimensionnement jQuery, vous pouvez rencontrer des situations où vous souhaitez que la fonction à exécuter une seule fois lorsque le navigateur a fini de redimensionner. Cependant, le comportement par défaut consiste à appeler la fonction en continu pendant le processus de redimensionnement.

Pour surmonter ce problème, vous pouvez utiliser une technique appelée « anti-rebond ». Voici comment cela fonctionne :

1. Définissez un intervalle :
   Démarrez une fonction chronométrée à l'aide de setInterval() pour vérifier si le navigateur est toujours en train de se redimensionner. Définissez un intervalle raisonnable, par exemple 50 à 100 millisecondes.
2. Effacer l'intervalle :
   Si le navigateur ne se redimensionne plus (par exemple, l'utilisateur a arrêté de faire glisser le bord de la fenêtre), effacez l'intervalle créé à l'étape 1 à l'aide de clearInterval(). Cela garantit que la fonction ne sera appelée qu'une seule fois.
3. Implémenter l'anti-rebond :
   Dans la fonction setInterval(), effectuez une vérification pour déterminer si le navigateur est toujours en train de redimensionner. Utilisez le code suivant comme exemple :

$(window).resize(() => {
  let timer;
  if (timer) {
    clearTimeout(timer);
  }
  timer = setTimeout(() => {
    // Your code to execute after resizing is complete
  }, 50);  // Adjust the delay as per your requirement
});

4. Initialiser la fonction anti-rebond :
   Déclenchez la fonction anti-rebond en l'appelant immédiatement après avoir défini l'écouteur d'événement de redimensionnement . Cela garantit que la fonction est exécutée une fois lors du chargement de la page.

En implémentant cette technique, vous pouvez appeler la fonction d'événement de redimensionnement une seule fois après la fin du redimensionnement du navigateur, résolvant ainsi efficacement le problème de la fonction continue. appels pendant le processus de redimensionnement.

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!