Evento onmouseleave
Ejemplo
Ejecute un JavaScript cuando mueva el puntero del mouse fuera de una imagen:
<img onmouseleave="normalImg(this)" src="smiley.gif" alt="Smiley">
Más ejemplos de "Pruébelo usted mismo" a continuación.
Definición y uso
El evento onmouseleave ocurre cuando el puntero del mouse se mueve fuera de un elemento.
Sugerencia: este evento a menudo se usa junto con el evento onmouseenter , que ocurre cuando el puntero del mouse se mueve sobre un elemento.
Consejo: El evento onmouseleave es similar al evento onmouseout . La única diferencia es que el evento onmouseleave no burbujea (no se propaga hacia arriba en la jerarquía del documento). Consulte "Más ejemplos" al final de esta página para comprender mejor las diferencias.
Compatibilidad con navegador
Los números de la tabla especifican la primera versión del navegador que es totalmente compatible con el evento.
Event | |||||
---|---|---|---|---|---|
onmouseleave | 30.0 | 5.5 | Yes | 6.1 | 11.5 |
Sintaxis
En HTML:
<element onmouseleave="myScript">
En JavaScript:
object.onmouseleave = function(){myScript};
En JavaScript, usando el método addEventListener():
object.addEventListener("mouseleave", myScript);
Nota: el método addEventListener() no es compatible con Internet Explorer 8 y versiones anteriores.
Detalles técnicos
Burbujas: | No |
---|---|
Cancelable: | No |
Tipo de evento: | RatónEvento |
Etiquetas HTML compatibles: | Todos los elementos HTML, EXCEPTO: <base>, <bdo>, <br>, <head>, <html>, <iframe>, <meta>, <param>, <script>, <style> y <title> |
Versión DOM: | Eventos de nivel 2 |
Más ejemplos
Ejemplo
Este ejemplo demuestra la diferencia entre los eventos onmousemove, onmouseleave y 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>