Evento onmouseleave

Eventos DOM MouseEvent

Definición y uso

Se produce el evento onmouseleave cuando el puntero del ratón sale del elemento.

Consejo:Este evento se usa generalmente con Evento onmouseenterusados juntos, este evento ocurre cuando el puntero del ratón se mueve sobre el elemento.

Consejo: El evento onmouseleave es similar a Evento onmouseout。La única diferencia es que el evento onmouseleave no se propaga (no se transmite a la estructura de documentos superior). Consulta más ejemplos en la parte inferior de la página.

Ejemplo

Ejemplo 1

Ejecutar JavaScript al mover el puntero del ratón fuera de la imagen：

<img onmouseleave="normalImg(this)" src="smiley.gif" alt="Smiley">

Prueba por ti mismo

Ejemplo 2

Este ejemplo demuestra la diferencia entre los eventos onmousemove, onmouseleave y onmouseout：

<div onmousemove="myMoveFunction()">
  <p id="demo">¡Voy a demostrar con onmousemove!</p>
</div>
<div onmouseleave="myLeaveFunction()">
  <p id="demo2">¡Voy a demostrar con onmouseleave!</p>
</div>
<div onmouseout="myOutFunction()">
  <p id="demo3">¡Voy a demostrar con onmouseout!</p>
</div>

Prueba por ti mismo

Sintaxis

En HTML：

<elemento onmouseleave="myScript">

Prueba por ti mismo

En JavaScript：

objeto.onmouseleave = function(){myScript};

Prueba por ti mismo

En JavaScript, utiliza el método addEventListener():

objeto.addEventListener("mouseleave", myScript);

Prueba por ti mismo

Notas：Internet Explorer 8 o versiones anteriores no lo soportan Método addEventListener()。

Detalles técnicos

Burbuja： No soportado
Cancelable： No soportado
Tipos de eventos： MouseEvent
Etiquetas HTML soportadas： Todos los elementos HTML, excepto: <base>, <bdo>, <br>, <head>, <html>, <iframe>, <meta>, <param>, <script>, <style> y <title>
Versión del DOM： Eventos de Nivel 2

浏览器支持

Los números en la tabla indican la versión del navegador que admite completamente el evento.

Eventos Chrome IE Firefox Safari Opera
onmouseleave 30.0 5.5 Soporte 6.1 11.5
Eventos DOM MouseEvent