« anterior próximo »
Páginas: [1]

Autor Tema: Eventos Javascript cómo detectar paso ratón onmouseover, onmouseout CU01157E  (Leído 1856 veces)

mouportador10

  • Sin experiencia
  • *
  • APR2.COM
  • Mensajes: 6
    • Ver Perfil
Eventos Javascript cómo detectar paso ratón onmouseover, onmouseout CU01157E
« en: 14 de Febrero 2017, 00:02 »
Solución al ejercicio propuesto CU01157E del curso avanzado de programación web con JavaScript:

Código: [Seleccionar]
<!DOCTYPE html>
<html>
<head>
<title>eventos</title>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<script type="text/javascript" >
window.onload = function () {
var nodos = document.querySelectorAll('h1, h3');
for (var i=0; i<nodos.length; i++) {
nodos[i].onmouseover = function() {
this.style.color = "orange";
}
nodos[i].onmouseout = function() {
this.style.color = "maroon";
}
}
var nodosP = document.querySelectorAll("p");
for (i in nodosP) {
nodosP[i].onmouseover = function () {
this.style.backgroundColor = "yellow";
}
nodosP[i].onmouseout = function () {
this.style.backgroundColor = "transparent";
}
}
}
</script>
</head>
<body> <p><a href="principal.html" title="Página principal" >Ir a la pagina principal</a></p>
<h1>Novedades</h1>
<p>Aquí presentamos las novedades del sitio.</p>
<h3>Lanzamos el producto X-FASHION</h3>
<p>Este producto permite estirar la piel hasta dejarla como la de un bebé.</p>
<p><img src="http://i.imgur.com/tq5Bs.png" title="Imagen del producto" alt="imagen producto x-fashion" /></p>
<h3>Mejoramos el producto T-MOTION</h3>
<p>Hemos lanzado una nueva versión del producto T-MOTION</p>
<p><img src="http://i.imgur.com/SpZyc.png" title="Imagen del producto tmotion" alt="imagen producto tmotion" /></p>
</body>
</html>
« Última modificación: 14 de Abril 2017, 20:15 por Ogramar »
En línea

pedro,,

  • Moderador Global
  • Experto
  • *******
  • APR2.COM
  • Mensajes: 1292
    • Ver Perfil
Re:Eventos Javascript. onmouseover, onmouseout CU01157E.
« Respuesta #1 en: 14 de Febrero 2017, 22:15 »
Buenas mouportador10.

El código está bien resuelto, así que nada que comentar.

Saludos. ;D
En línea
Páginas: [1]
« anterior próximo »
 

Sobre la educación, sólo puedo decir que es el tema más importante en el que nosotros, como pueblo, debemos involucrarnos.

Abraham Lincoln (1808-1865) Presidente estadounidense.

aprenderaprogramar.com: Desde 2006 comprometidos con la didáctica y divulgación de la programación

Preguntas y respuestas

¿Cómo establecer o cambiar la imagen asociada (avatar) de usuario?
  1. Inicia sesión con tu nombre de usuario y contraseña.
  2. Pulsa en perfil --> perfil del foro
  3. Elige la imagen personalizada que quieras usar. Puedes escogerla de una galería de imágenes o subirla desde tu ordenador.
  4. En la parte final de la página pulsa el botón "cambiar perfil".