Element : évènement mouseover

L'évènement mouseover est déclenché à partir d'un Element lorsqu'un dispositif de pointage (une souris par exemple) déplace le curseur sur l'élément ou sur l'un de ses éléments fils.

Se propage/remonte dans le DOM Oui
Annulable Oui
Interface MouseEvent
Propriété pour la gestion d'évènement onmouseover

Exemples

L'exemple suivant illustre la différence entre les évènements mouseover et mouseenter.

HTML

<ul id="test">
  <li>item 1</li>
  <li>item 2</li>
  <li>item 3</li>
</ul>

JavaScript

let test = document.getElementById("test");
  
// Ce gestionnaire ne sera exécuté qu'une fois
// lorsque le curseur se déplace sur la liste
test.addEventListener("mouseenter", function( event ) {   
  // on met l'accent sur la cible de mouseenter
  event.target.style.color = "purple";

  // on réinitialise la couleur après quelques instants
  setTimeout(function() {
    event.target.style.color = "";
  }, 500);
}, false);

// Ce gestionnaire sera exécuté à chaque fois que le curseur
// se déplacera sur un autre élément de la liste
test.addEventListener("mouseover", function( event ) {   
  // on met l'accent sur la cible de mouseover
  event.target.style.color = "orange";

  // on réinitialise la couleur après quelques instants
  setTimeout(function() {
    event.target.style.color = "";
  }, 500);
}, false);

Résultat

Spécifications

Spécification État
UI Events
La définition de 'mouseover' dans cette spécification.
Version de travail
Document Object Model (DOM) Level 3 Events Specification
La définition de 'mouseover' dans cette spécification.
Obsolete

Compatibilité des navigateurs

Update compatibility data on GitHub
OrdinateurMobile
ChromeEdgeFirefoxInternet ExplorerOperaSafariWebview AndroidChrome pour AndroidFirefox pour AndroidOpera pour AndroidSafari sur iOSSamsung Internet
mouseover eventChrome Support complet 2Edge Support complet 12Firefox Support complet 6IE Support complet 9Opera Support complet 9.5Safari Support complet 4WebView Android Support complet ≤37Chrome Android Support complet 18Firefox Android Support complet 6Opera Android Support complet 10.1Safari iOS Support complet 3.2Samsung Internet Android Support complet 1.0

Légende

Support complet  
Support complet

Voir aussi