30 - Eventos onmouseover, onmouseout
Problema:
Implementar una página que contenga tres botones y cuando ingrese la flecha del mouse al botón cambiar el color de texto del mismo, retornando al color original cuando retiramos la flecha del control.
pagina.html
estilos.css
funciones.js
Ejecución de la página
<!DOCTYPE html> <html lang="es"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Prueba</title> </head> <body> <input type="button" name="boton1" value="boton 1" onmouseover="entrada(this)" onmouseout="salida(this)"> <br> <input type="button" name="boton2" value="boton 2" onmouseover="entrada(this)" onmouseout="salida(this)"> <br> <input type="button" name="boton3" value="boton 3" onmouseover="entrada(this)" onmouseout="salida(this)"> <script src="funciones.js"></script> </body> </html>
function entrada(objeto) { objeto.style.color = '#f00' } function salida(objeto) { objeto.style.color = '#000' }
No tiene disponible el navegador la capacidad de iframe
Retornar