Analyse des différences entre le survol, le survol et le mouseout dans jQuery_jquery

Cet article analyse les différences entre le survol, le survol et la sortie de la souris dans jQuery avec des exemples. Partagez-le avec tout le monde pour votre référence, les détails sont les suivants :

Je pensais qu'en jquery, les événements mouseover et mouseout sont en fait égaux à l'événement hover. Il n’y a aucune différence entre les deux, ils devraient être identiques. Mais hier un effet d'animation m'a fait comprendre que les deux ne sont pas équivalents.

<div class="wrapper">
<div class="img"></div>
<div class="text"></div>
</div>
<div class="point"></div>

Ajoutez un événement au wrapper, et lorsque la souris se déplace vers le wrapper, le calque avec class="point" sera agrandi. Mais si vous utilisez les événements mouseover et mouseout, lorsque la souris se déplace vers le calque wrapper, le calque de points deviendra plus grand, mais lorsque la souris se déplacera entre les calques img et text, le calque de points deviendra de plus en plus petit, en constante évolution. . Ce n'est pas le résultat que nous voulons. Ce que nous voulons, c'est que tant que la souris est sur le calque wrapper, qu'il s'agisse d'une image ou d'un texte, le point deviendra plus grand, mais lorsque la souris ne sort pas du calque wrapper, la couche de points ne deviendra pas plus petite.

Lentement, l'idée est devenue claire. Nous avons résolu le problème en utilisant le survol au lieu du survol et du retrait de la souris.

C’est vraiment exagéré qu’il nous ait fallu beaucoup de temps pour résoudre un problème aussi simple. Écrivez un article pour commémorer.

Supplément : Plus tard, mon maître a dit qu'il y avait en fait ce paragraphe dans le code source de jquery :

hover: function( fnOver, fnOut ) {
 return this.mouseenter( fnOver ).mouseleave( fnOut || fnOver );
}

C'est à dire planer ! = survol de la souris. Mais hover=mouseenter mouseleave.

J'espère que cet article sera utile à tous ceux qui programment jQuery.