Ver Mensaje Individual
  #1 (permalink)  
Antiguo 02/08/2016, 14:59
Avatar de BramSt
BramSt
 
Fecha de Ingreso: abril-2015
Mensajes: 117
Antigüedad: 9 años
Puntos: 5
imagen que cambia y fade

Hola a todos.

Estoy dando mis primeros pasos con jquery, y me gustaría ver si podéis ayudarem, porque hay algo que, por más que lo intento, no logro entender:

estoy intentando hacer que una etiqueta img vaya tomando diferentes imagenes de un array (son 3 imagenes), y que el cambio se haga mediante un fadeIn.

Lo que ocurre es que, por más que lo intento, sólo consigo que se vualice la ú,tima imagen del array. Sé que las imagenes cambian correctamente (o eso creo), por los resultados que arroja el alert del código.

Mi código es este:

Código HTML:
Ver original
  1. <img  id="foto4" src="imagen1.jpg"/>

Y el código jquery que debería ejecutar lo que quiero:

Código Javascript:
Ver original
  1. var almacenFotos=['imagen2.jpg','imagen3.jpg'];/*para hacer el fade en la misma foto*/
  2.  
  3. $.each(almacenFotos,function (indice, valor)
  4.        
  5.            
  6.             {
  7.                 //alert("valor del indice "+indice+" : "+valor);
  8.                
  9.                 $("#foto4").fadeOut(2000);
  10.                
  11.                 $("#foto4").attr('src',valor).fadeIn(2000);
  12.                
  13.                
  14.                
  15.                
  16.                
  17.             }
  18.        
  19.        
  20.         );

Parece como si el cambio de atributo src se ejecutara demasiado rápido, por un lado, de manera que apenas puede apreciarse a la vista...

De hecho, por otra parte, el alert que he dejado comentado, y que se ejecuta por cada elemento, demuestra efectivamente que las imagenes van apareciendo correctamente... lo que sucede es que es cuando se llega al último elemento del array, que se ejecutan todos los fade in...

No lo entiendo, la verdad. He probado con un for en vez de con el método each y ocurre lo mismo. Algo debe fallar en mi lógica pero no veo que es :(

Si podéis ayudarme os estaría muy agradecido.

Última edición por BramSt; 02/08/2016 a las 15:10