Evento onmouseover

Eventos DOM MouseEvent

Definición y uso

El evento onmouseover ocurre cuando el puntero del ratón se mueve sobre el elemento o uno de sus elementos hijos.

Consejo:Este evento se usa comúnmente con Evento onmouseoutUsado junto con, ocurre este evento cuando el usuario saca el puntero del ratón del elemento.

Ejemplo

Ejemplo 1

Ejecutar JavaScript al mover el puntero del ratón sobre la imagen:

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

Prueba personalmente

Ejemplo 2

Este ejemplo muestra la diferencia entre los eventos onmousemove, onmouseenter y mouseover:

<div onmousemove="myMoveFunction()">
  <p id="demo">¡Demostraré onmousemove!</p>
</div>
<div onmouseenter="myEnterFunction()">
  <p id="demo2">¡Demostraré onmouseenter!</p>
</div>
<div onmouseover="myOverFunction()">
  <p id="demo3">¡Demostraré onmouseover!</p>
</div>

Prueba personalmente

Sintaxis

En HTML:

<elemento onmouseover="myScript">

Prueba personalmente

En JavaScript:

objeto.onmouseover = function(){myScript};

Prueba personalmente

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

objeto.addEventListener("mouseover", myScript);

Prueba personalmente

Nota:Internet Explorer 8 o versiones anteriores no lo admiten Método addEventListener().

Detalles técnicos

Burbujeo: Soporte
Cancelables: Soporte
Tipos de eventos: MouseEvent
Etiquetas HTML admitidas: Todos los elementos HTML, excepto: <base>, <bdo>, <br>, <head>, <html>, <iframe>, <meta>, <param>, <script>, <style> y <title>
Versión DOM: Eventos de Nivel 2

Compatibilidad con navegadores

Eventos Chrome IE Firefox Safari Opera
onmouseover Soporte Soporte Soporte Soporte Soporte
Eventos DOM MouseEvent