Jquery Slider. Position précédente

Question

Je fais un curseur avec jquery.

http://jsfiddle.net/JwmxK/

var slidePath = '.testSlider > div.slide'; 

var sliderDuration = 53000; 

var rotate = setInterval(slideShow, sliderDuration); 

$(slidePath).hide(); 

slideShowFirst(); 

$('.slider-block').hover(function() { 
    clearInterval(rotate); 
}, function() { 
    rotate = setInterval(function() { 
     slideShow(); 
    }, sliderDuration); 
}); 

$('.control-right').click(slideShow); 

$('.control-left').click(function() { 

    $(slidePath + ':eq(-2)').fadeIn('slow'); 

    $(slidePath + ':last-child').fadeOut('slow').prependTo('.testSlider'); 
}); 

function slideShow() { 

    $(slidePath + ':last-child').fadeOut('slow'); 

    $(slidePath + ':first-child').fadeIn('slow').appendTo('.testSlider'); 
} 

function slideShowFirst() { 

    $(slidePath + ':first-child').appendTo('.testSlider').show(); 
} 

Dans mon curseur, il est simple Ken Burns comme effet. Avec l'animation css, l'image de diapositive actuelle est en rotation et zoom avant.

Lorsque je passe à la diapositive PRECEDENTE, l'image actuelle revient à son état initial en une seconde (l'échelle est 100% et sans zoom), puis le la diapositive précédente apparaît. Ça a l'air moche. Quand je vais à la diapositive suivante, je n'ai pas un tel problème.

Qu'est-ce qui ne va pas?

J'ai essayé de changer la fonction de commande gauche sur elle:

$('.control-left').click(function() { 

    $(slidePath + ':last-child').fadeOut('slow'); 

    $(slidePath + ':eq(-2)').fadeIn('slow'); 

    $(slidePath + ':last-child').prependTo('.reveSlider'); 
}); 

Mais je ne change ..

Answer 1

Je devine que par le dernier que vous voulez dire le bouton appelé .control-left essayez ceci:

$('.control-left').click(function() { 

    $(slidePath + ':eq(-2)').fadeOut('slow'); // change to .fadeOut() 

    $(slidePath + ':last-child').fadeIn('slow').prependTo('.testSlider'); // change to fadeIn() 
}); 

si cela ne fonctionne pas, je ne suis pas trop sûr avec votre HTML, vous pouvez essayer cette

$('.control-left').click(function() { 
    $(slidePath + ':last-child').fadeOut('slow').prependTo('.testSlider'); 
    $(slidePath + ':eq(-2)').fadeIn('slow');  
}); 

voir comment ils sont retournés? vous devriez fadeOut() avant fadeIn()