jQuery each

[diphda]

Hola
Estoy intentando hacer un bucle sobre los elementos de una lista, para aplicarles una serie de efectos. Este es el código:

Código:

<input id="boton" type="submit" value="Aceptar"/>
<ul id=lista>
    <li id=0>
      Uno
    </li>
    <li id=1>
      Dos
    </li>
    <li id=2>
      Tres
    </li>
    <li id=3>
       Cuatro
     </li>
  </ul>

Código Javascript:

<script type="text/javascript">
     $(function(){
         $("#boton").click(function(event){
            event.preventDefault();
            $("li").each(function(i){
                 $(this).fadeOut(1000);
                 $(this).delay(1000);
                 $(this).fadeIn(1000);
            })
         })
     })
 

El caso es que por más que le doy vueltas, todas las opciones me dan el mismo resultado, es decir, que se ocultan todos los elementos de la lista a la vez, y se muestran después todos a la vez y lo que yo quiero es que primero se oculte el primer elemento (fadeOut), haga el delay y se muestre (fadeIn), pero que el resto no haga nada todavía; después que continúe con el segundo elemento (fadeOut, delay, fadeIn), etc.

Con un bucle for el resultado es el mismo, en lugar de hacer todas las funciones para un elemento y seguir en el siguiente, hace la primera función para todos los elementos (fadeOut) y luego la segunda (delay) para todos y luego la tercera (fadeIn) para todos

gracias
saludos

[Danielfuzz]

hola diphna, intenta con este script:

Código:

<script type="text/javascript">
	var i=0;
	 $(function(){
         $("#boton").click(function(event){ 	
            	event.preventDefault();
				animar(i);
            })
         })
	function animar(i)
	{
		var actual=$("li")[i];
		if(actual!=undefined)
			$(actual).fadeOut(1000).delay(1000).fadeIn(1000, function(){animar(i+1);});
	}
</script>

Suerte!!


P.D.:
No olvides el Karma (click en "Me gustó, ¡gracias!" en la parte de abajo de este mensaje)

[diphda]

Maravilloso!!!
mil gracias
saludos