hover est un effet interactif couramment utilisé dans jquery, qui peut déclencher des événements correspondants lorsque la souris survole ou quitte. Voici comment écrire le survol en jquery.
Vous pouvez utiliser la méthode hover() de jquery pour ajouter des gestionnaires de survol de la souris et laisser des événements pour un seul élément.
$("element").hover( function(){ $(this).addClass("hover");//添加hover类名 }, function(){ $(this).removeClass("hover");//移除hover类名 } );
Dans le code ci-dessus, nous sélectionnons d'abord un élément, puis utilisons la méthode hover() pour ajouter un gestionnaire d'événements. Lorsque la souris entre dans l'élément, la première fonction est exécutée, ce qui ajoute le nom de la classe de survol à l'élément. Lorsque la souris sort de l'élément, la deuxième fonction est exécutée, ce qui supprime le nom de la classe de survol de l'élément. .
Si vous devez obtenir l'effet de survol pour plusieurs éléments, nous pouvons y parvenir en parcourant chaque élément, puis en appelant la méthode hover().
$(".elements").each(function(){ $(this).hover( function(){ $(this).addClass("hover");//添加hover类名 }, function(){ $(this).removeClass("hover");//移除hover类名 } ); });
Dans le code ci-dessus, nous sélectionnons d'abord tous les éléments, puis utilisons la méthode each() pour parcourir chaque élément, puis appelons la méthode hover() pour ajouter des gestionnaires d'événements.
jquery nous fournit un moyen pratique d'abréger l'effet de survol. Nous pouvons utiliser la méthode mouseenter() pour remplacer le premier paramètre de la méthode hover(). De même, nous pouvons utiliser la méthode mouseleave() pour remplacer le deuxième paramètre de la méthode hover().
$("element").mouseenter(function(){ $(this).addClass("hover");//添加hover类名 }).mouseleave(function(){ $(this).removeClass("hover");//移除hover类名 });
Dans le code ci-dessus, nous utilisons la méthode mouseenter() pour ajouter le gestionnaire d'événements de déplacement de la souris, la méthode mouseleave() pour ajouter le gestionnaire d'événements de déplacement de la souris et utilisons des appels en chaîne pour simplifier le code.
Résumé
hover est un effet interactif couramment utilisé dans jquery, qui peut déclencher des événements correspondants lorsque la souris survole ou quitte. jquery fournit la méthode hover() et la méthode d'abréviation, qui peuvent facilement ajouter des effets de survol à un ou plusieurs éléments. Lorsque vous utilisez le survol, vous devez faire attention à éviter de déclencher des événements plusieurs fois pour améliorer les performances.
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!