Événement onmouseleave
Exemple
Exécutez un JavaScript lorsque vous déplacez le pointeur de la souris hors d'une image :
<img onmouseleave="normalImg(this)" src="smiley.gif" alt="Smiley">
Plus d'exemples "Essayez-le vous-même" ci-dessous.
Définition et utilisation
L'événement onmouseleave se produit lorsque le pointeur de la souris est déplacé hors d'un élément.
Conseil : cet événement est souvent utilisé avec l' événement onmouseenter , qui se produit lorsque le pointeur de la souris est déplacé sur un élément.
Conseil : L'événement onmouseleave est similaire à l' événement onmouseout . La seule différence est que l'événement onmouseleave ne bouillonne pas (ne se propage pas dans la hiérarchie du document). Voir "Plus d'exemples" au bas de cette page pour mieux comprendre les différences.
Prise en charge du navigateur
Les nombres dans le tableau indiquent la première version du navigateur qui prend entièrement en charge l'événement.
Event | |||||
---|---|---|---|---|---|
onmouseleave | 30.0 | 5.5 | Yes | 6.1 | 11.5 |
Syntaxe
En HTML :
<element onmouseleave="myScript">
En Javascript :
object.onmouseleave = function(){myScript};
En JavaScript, en utilisant la méthode addEventListener() :
object.addEventListener("mouseleave", myScript);
Remarque : La méthode addEventListener() n'est pas prise en charge dans Internet Explorer 8 et les versions antérieures.
Détails techniques
Bulles: | Non |
---|---|
Annulable : | Non |
Type d'événement: | SourisEvénement |
Balises HTML compatibles : | 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 |
Plus d'exemples
Exemple
Cet exemple montre la différence entre les événements onmousemove, onmouseleave et onmouseout :
<div onmousemove="myMoveFunction()">
<p id="demo">I will demonstrate onmousemove!</p>
</div>
<div onmouseleave="myLeaveFunction()">
<p id="demo2">I will demonstrate onmouseleave!</p>
</div>
<div onmouseout="myOutFunction()">
<p id="demo3">I will demonstrate onmouseout!</p>
</div>