jquery galeria desaparecendo

Question

Hay tudo, já que eu escrevi um simples desaparecendo galeria com jQuery. Ele basicamente laços apesar de um conjunto de imagens, desvanecendo-se de um para outro. Ele funciona perfeitamente, como previsto, até chegar à última imagem, então não se desvanece a partir do último para o primeiro, só para o exibe.

aqui está o meu jQuery

$(document).ready(function(){

Zindex = 99999;
i = 0;

$(".flash img").each(function(){
    $(this).css({
        'position':'absolute',
        'z-index':Zindex,
        'display':'none'
    });
    Zindex--;
});

$(".flash img:first").show();

doFade = function(){        
    if( i == 6 ) { i = 0; };        
    $(".flash img:eq("+parseInt(i+1)+")").fadeIn(100);
    $(".flash img:eq("+parseInt(i)+")").fadeOut(1000);      
    setTimeout("doFade()", 2000);
    i++;
};

doFade();

});

Nota:. Só há sempre vai ser 7 imagens

E minha marcação

<div class='flash'>
    <img src="img/gallery/picture1.jpg" width="780" height="253" alt="Picture1">
    <img src="img/gallery/picture2.jpg" width="780" height="253" alt="Picture2">
    <img src="img/gallery/picture3.jpg" width="780" height="253" alt="Picture3">
    <img src="img/gallery/picture4.jpg" width="780" height="253" alt="Picture4">
    <img src="img/gallery/picture5.jpg" width="780" height="253" alt="Picture5">
    <img src="img/gallery/picture6.jpg" width="780" height="253" alt="Picture6">
    <img src="img/gallery/picture7.jpg" width="780" height="253" alt="Picture7">
</div> 

Eu acho que as mentiras de problema na linha

if( i == 6 ) { i = 0; };

Answer 1

Duas coisas estão acontecendo quando você chegar ao final do 'loop' e executar:

if( i == 6 ) { i = 0; };

Em primeiro lugar, você está desaparecendo em i + 1, que é a segunda imagem, não o primeiro, porque i é agora a 0.

Em segundo lugar, você está desaparecendo i, a primeira imagem, o que não é ainda visível. Essa última imagem que está sendo exibido era a imagem 7, quando i + 1 era 6.

Então, você nunca está escondendo a última imagem, e nunca mostrando a primeira imagem. Uma solução muito rápida para mim era fazer o fade out declaração o primeiro a executar (i ainda está 'apontar' para a imagem atual) e definindo i = -1 vez de 0 quando termina o 'loop'.

doFade = function(){
    $(".flash img:eq("+parseInt(i)+")").fadeOut(1000); 
    if( i == 6 ) { i = -1; }
    $(".flash img:eq("+parseInt(i+1)+")").fadeIn(100);             
    setTimeout("doFade()", 2000);
    i++;
};

No entanto, isso não parece interromper o fluxo das transições quando se inicia o laço sobre (Acho que é porque as declarações de fade estão agora separados por lógica). Uma solução simples para isso deve ser tão fácil como a introdução de variáveis ??current e next e fazer toda a lógica no início, usando essas variáveis ??nas declarações de fade.