Hay que cambiar algunas cosas, primero es mejor usar
setInterval en vez de
setTimeout, tambien hay que modificar un poco el operador if para reiniciar correctamente el recorrido de las imagenes.
Código Javascript
:
Ver originalfunction imagenes(){
var imagenes= new Array();
var contador=0;
//var imagen=document.getElementById("miImagen");
imagenes [0]="images/fotoCiencias.jpg";
imagenes [1]="images/fotoDerecho.jpg";
imagenes [2]="images/fotoEconomicas.jpg";
imagenes [3]="images/fotoEducacion.jpg";
setInterval(function() {
var imagen = document.getElementById('miImagen');
var actual = contador >= (imagenes.length-1)? 0: contador+1;
imagen.src = imagenes[actual];
contador = actual;
},3000);
}
Con esto debe funcionar solo se necesita llamar a la función imagenes() en el evento onload de <body>. Además es conveniente colocar en el atributo src de <img> la primera imagen.
Código HTML:
Ver original<body onload="imagenes()"> <img src="images/fotoCiencias.jpg" alt="imagen1" id="miImagen" />