Maison interface Web tutoriel HTML Quelle est la différence entre onmouseover et hover en CSS ?

Quelle est la différence entre onmouseover et hover en CSS ?

Jun 28, 2017 am 10:50 AM
hover

Le survol inclut le processus consistant à déplacer la souris sur l'objet et à déplacer la souris hors de l'objet en même temps, et la sous-classe correspondante est également sélectionnée.

Mouseover signifie que lorsque la souris passe sur un objet, toutes les sous-classes qui ne l'incluent pas sont sélectionnées en même temps.

La principale différence est que les pilotes d'événements sont également ajoutés aux sous-classes des éléments de survol. Et le survol de la souris ajoute uniquement le pilote d'événement à l'élément actuel.

et l'événement hover contient l'événement mouseover


mousemove(fn);

Liez une fonction de gestionnaire à l'événement mousemove de chaque élément correspondant.

hover(over, out);

Une méthode qui simule les événements de survol (la souris se déplace sur et hors d'un objet). Il s'agit d'une méthode personnalisée qui fournit un état « conserver » pour les tâches fréquemment utilisées.

Lorsque la souris passe sur un élément correspondant, la première fonction spécifiée sera déclenchée. Lorsque la souris quitte cet élément, la deuxième fonction spécifiée sera déclenchée. De plus, cela s'accompagnera d'une détection si la souris est toujours dans un élément spécifique (détection de sous-classes). Si c'est le cas, elle continuera à rester dans l'état "hover" sans déclencher l'événement de déplacement (mouseout).

$("td").hover( function() { $(this).addClass("survol"); }, fonction () { $(this).removeClass("survol"); });

Il existe un tel paragraphe dans le code source de jquery :
hover: function( fnOver, fnOut ) {
return this.mouseenter( fnOver ).mouseleave( fnOut || fnOver ) ;
}

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

Dans le passé, je savais seulement que les pseudo-classes comme hover, link, visited et active ne pouvaient être appliquées qu'à la balise a, c'est-à-dire qu'elles devaient être écrites sous la forme a:hover, a:link, a: visité, a: actif. En fait, ces quatre éléments peuvent être appliqués à d’autres balises HTML et classes attribuées à d’autres définitions.

Pour plus d'informations sur les pseudo-classes CSS, veuillez vous référer à : http://www.w3school.com.cn/css/css_pseudo_classes.asp

a:link {color: #FF0000} /* Lien non visité*/

a:visited {color: #00FF00} /* Lien visité*/

a:hover {color: #FF00FF} /* Déplacez la souris vers le lien* /

a:active {color: #0000FF} /* Lien sélectionné*/


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!

Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn

Outils d'IA chauds

Undresser.AI Undress

Undresser.AI Undress

Application basée sur l'IA pour créer des photos de nu réalistes

AI Clothes Remover

AI Clothes Remover

Outil d'IA en ligne pour supprimer les vêtements des photos.

Undress AI Tool

Undress AI Tool

Images de déshabillage gratuites

Clothoff.io

Clothoff.io

Dissolvant de vêtements AI

AI Hentai Generator

AI Hentai Generator

Générez AI Hentai gratuitement.

Article chaud

Repo: Comment relancer ses coéquipiers
1 Il y a quelques mois By 尊渡假赌尊渡假赌尊渡假赌
R.E.P.O. Crystals d'énergie expliqués et ce qu'ils font (cristal jaune)
2 Il y a quelques semaines By 尊渡假赌尊渡假赌尊渡假赌
Hello Kitty Island Adventure: Comment obtenir des graines géantes
1 Il y a quelques mois By 尊渡假赌尊渡假赌尊渡假赌
Combien de temps faut-il pour battre Split Fiction?
4 Il y a quelques semaines By DDD

Outils chauds

Bloc-notes++7.3.1

Bloc-notes++7.3.1

Éditeur de code facile à utiliser et gratuit

SublimeText3 version chinoise

SublimeText3 version chinoise

Version chinoise, très simple à utiliser

Envoyer Studio 13.0.1

Envoyer Studio 13.0.1

Puissant environnement de développement intégré PHP

Dreamweaver CS6

Dreamweaver CS6

Outils de développement Web visuel

SublimeText3 version Mac

SublimeText3 version Mac

Logiciel d'édition de code au niveau de Dieu (SublimeText3)

Astuce CSS : utilisez la transition pour conserver l'état de survol Astuce CSS : utilisez la transition pour conserver l'état de survol Sep 27, 2022 pm 02:01 PM

Comment préserver l’état de survol ? L'article suivant vous expliquera comment conserver l'état de survol sans utiliser JavaScript. J'espère qu'il vous sera utile !

L'expérience vole. Prenez un vol avec la caméra Haval X1. L'expérience vole. Prenez un vol avec la caméra Haval X1. Jan 15, 2024 pm 02:21 PM

Nous pouvons souvent voir de superbes vidéos vues de haut en bas sur Internet. Les photos prises par les drones sont en effet assez choquantes. Cependant, en fait, de nombreuses personnes ont une connaissance limitée des drones, par exemple, pourquoi peuvent-ils encore voler dans certains endroits. où le vol est restreint ? En fait, les « drones » prêts à voler sont actuellement le courant dominant, et ils méritent davantage le choix de la plupart des gens. Aujourd'hui, je vais vous faire vivre une expérience pratique avec la Harvest Flying Camera X1. En termes d'apparence, la Harvest Flying Camera X1 a le premier design pliable. L'ensemble de l'appareil photo ne pèse que 125 g, ce qui est plus léger qu'un téléphone portable. Il peut être facilement tenu après pliage et peut être mis dans un sac sans aucune pression. Quatre feuilles teintes en douceur et un cadre de sécurité protègent parfaitement la sécurité du tir. Dyed Leaf utilise de manière innovante un substrat biologique biosourcé, hautement élastique, durable, sûr et respectueux de l'environnement. Il dispose également d'un cadre entièrement protecteur pour protéger vos mains pendant le décollage et l'atterrissage.

Comment supprimer l'événement de survol en CSS Comment supprimer l'événement de survol en CSS Feb 01, 2023 am 10:06 AM

Méthodes pour supprimer les événements de survol CSS : 1. Via "$("a").hover(function(){ alert('mouseover'); }, function(){ alert('mouseout'); })" pour lier l'événement de survol ; 2. Dissociez l'événement de survol via la méthode "$('a').off('mouseenter').unbind('mouseleave');". Peut.

Comment utiliser le survol en CSS Comment utiliser le survol en CSS Feb 23, 2024 pm 12:06 PM

La pseudo-classe hover en CSS est un sélecteur très couramment utilisé qui permet de changer le style d'un élément lorsque la souris le survole. Cet article présentera l'utilisation du survol et fournira des exemples de code spécifiques. 1. Utilisation de base Pour utiliser le survol, nous devons d'abord définir un style pour l'élément, puis utiliser la pseudo-classe :hover pour spécifier le style correspondant lorsque la souris survole. Par exemple, nous avons un élément bouton Lorsque la souris survole le bouton, nous voulons que la couleur d'arrière-plan du bouton passe au rouge et la couleur du texte au blanc.

Pourquoi le survol est un pseudo-élément Pourquoi le survol est un pseudo-élément Oct 09, 2023 pm 05:45 PM

Hover n'est pas un pseudo-élément, c'est une pseudo-classe. Les pseudo-classes sont utilisées pour sélectionner un état ou un comportement spécifique d'un élément, tandis que les pseudo-éléments sont utilisés pour ajouter des styles à des parties spécifiques d'un élément. Parce que :hover est utilisé pour sélectionner un état spécifique d'un élément plutôt que d'ajouter des styles à une partie spécifique de l'élément, vous pouvez utiliser la pseudo-classe :hover pour styliser l'état de survol d'un élément, et vous pouvez utiliser le :hover pseudo-classe pour ajouter des effets de survol aux liens. La couleur du lien, la couleur d'arrière-plan, etc. peuvent changer lorsque la souris le survole.

Le rôle du survol en HTML Le rôle du survol en HTML Feb 20, 2024 am 08:58 AM

Le rôle du survol en HTML et exemples de code spécifiques Dans le développement Web, le survol signifie que lorsque l'utilisateur passe le curseur sur un élément, certaines actions ou effets sont déclenchés. Il est implémenté via la pseudo-classe CSS :hover. Dans cet article, nous présenterons le rôle du survol et des exemples de code spécifiques. Premièrement, le survol permet à un élément de changer de style lorsque l'utilisateur le survole. Par exemple, lorsque vous passez la souris sur un bouton, vous pouvez modifier la couleur d'arrière-plan ou la couleur du texte du bouton pour rappeler à l'utilisateur la marche à suivre.

Comment utiliser la méthode jQuery hover() Comment utiliser la méthode jQuery hover() Dec 04, 2023 am 09:56 AM

hover() est une méthode couramment utilisée dans jQuery. Elle est utilisée pour lier deux fonctions de gestion d'événements. Ces deux fonctions seront exécutées lorsque le pointeur de la souris entre et quitte l'élément correspondant. La méthode d'utilisation de base est "$(selector).hover(inFunction,outFunction);".

Comment utiliser le survol en CSS Comment utiliser le survol en CSS Nov 24, 2023 am 10:32 AM

En CSS, :hover est un pseudo-sélecteur utilisé pour sélectionner les éléments survolés par le pointeur de la souris. Vous pouvez utiliser :hover pour appliquer certaines modifications de style lorsque l'utilisateur survole un élément.

See all articles