Événement onmouseover

Événements DOM MouseEvent

Définition et utilisation

L'événement onmouseover se produit lorsque le curseur de la souris se déplace sur l'élément ou l'un de ses éléments enfants.

Astuce :Cet événement est généralement utilisé avec Événement onmouseoutUtilisé ensemble, cet événement se produit lorsque l'utilisateur déplace le curseur de la souris hors de l'élément.

Exemple

Exemple 1

Exécutez JavaScript lorsque le curseur de la souris est déplacé sur l'image :

<img onmouseover="bigImg(this)" src="smiley.gif" alt="Smiley">

Essayez-le vous-même

Exemple 2

Cet exemple montre la différence entre les événements onmousemove, onmouseenter et mouseover :

<div onmousemove="myMoveFunction()">
  <p id="demo">Je vais démontrer onmousemove !</p>
</div>
<div onmouseenter="myEnterFunction()">
  <p id="demo2">Je vais démontrer onmouseenter !</p>
</div>
<div onmouseover="myOverFunction()">
  <p id="demo3">Je vais démontrer onmouseover !</p>
</div>

Essayez-le vous-même

Syntaxe

Dans HTML :

<element onmouseover="myScript">

Essayez-le vous-même

Dans JavaScript :

object.onmouseover = function(){myScript};

Essayez-le vous-même

Dans JavaScript, utilisez la méthode addEventListener() :

object.addEventListener("mouseover", myScript);

Essayez-le vous-même

Remarque :Internet Explorer 8 et versions antérieures ne prennent pas en charge Méthode addEventListener().

Détails techniques

Bubbling : Support
Annulable : Support
Types d'événements : MouseEvent
Étiquettes HTML prises en charge : Tous les éléments HTML, sauf : <base>, <bdo>, <br>, <head>, <html>, <iframe>, <meta>, <param>, <script>, <style> et <title>
Version DOM : Événements de niveau 2

Support du navigateur

Événements Chrome IE Firefox Safari Opera
onmouseover Support Support Support Support Support
Événements DOM MouseEvent