JavaScript - Javascript eventos mouseover mouseout

 
Vista:
sin imagen de perfil

Javascript eventos mouseover mouseout

Publicado por eurostrato (2 intervenciones) el 11/12/2014 11:04:25
Hola, tengo un problema con este codigo.
Espero que podais echarme una mano.

El problema es que consigo que la foto cambie cuando paso el raton por encima pero al sacar el raton de la foto quiero que vuelva a la foto inicial (y esto si que no lo consigo).

Gracias.

Este es el codigo

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
<!DOCTYPE html>
<html>
 
<head>
<meta charset="UTF-8">
<title>Evento onmouse</title>
 
<script>
//Funcion que cambia la foto al pasar el raton por encima 
function encima()
{
document.write('<img src="picas.jpg" >');
}
 
//Funcion que vuelve a poner la pagina inicial al sacar el raton de encima de la foto 
 
function fuera()
{
document.write('<img src="corazones.jpg">');
}
</script>
 
</head>
 
<body>
 
<!--Cargo una pagina con una foto -->
 
<img src="corazones.jpg"  onmouseover="encima()" ; onmouseout="fuera()";>
 
<body>
</html>
Valora esta pregunta
Me gusta: Está pregunta es útil y esta claraNo me gusta: Está pregunta no esta clara o no es útil
0
Responder
Imágen de perfil de xve
Val: 3.162
Oro
Ha mantenido su posición en JavaScript (en relación al último mes)
Gráfica de JavaScript

Javascript eventos mouseover mouseout

Publicado por xve (2100 intervenciones) el 11/12/2014 15:46:56
Hola, de la manera, que tienes tu código, no cambias la imagen, sino que la vas añadiendo...

Tienes que indicar en las imágenes que vas añadiendo, los eventos...
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
<!DOCTYPE html>
<html>
<head>
	<meta charset="UTF-8">
	<title>Evento onmouse</title>
 
	<script>
	function encima()
	{
		document.write('<img src="img_1.jpg" onmouseover="encima()" onmouseout="fuera()">');
	}
 
	function fuera()
	{
		document.write('<img src="img_2.jpg" onmouseover="encima()" onmouseout="fuera()">');
	}
	</script>
</head>
 
<body>
	<img src="img_2.jpg" onmouseover="encima()" onmouseout="fuera()">
<body>
</html>

Exactamente que quieres hacer?
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar