Search code examples
jqueryanimationbuttonsliderslideshow

Slider - Why my prev button doesn't work?


All is in the title! The whole things work excepted a bug on the prev btn... If you've got any solutions, feel free to reply!

Thank you all.


$(function() {
var     timer;
function autoplay() { 
    $('.slideshow > li:gt(0)').hide();
    timer = setInterval(function() { 
         $('.slideshow > :first-child').fadeOut(500).next().fadeIn().end().appendTo('.slideshow');
    }, 5000);
}
autoplay();
$('#prev, #next').click(function() {
    switch (this.id) {
        case 'prev': {
            clearInterval(timer); autoplay();
            $('.slideshow > :last-child').fadeOut(500).prev().fadeIn().end().appendTo('.slideshow');
        }
            break;
        case 'next': {
            clearInterval(timer); autoplay();
            $('.slideshow > :first-child').fadeOut(500).next().fadeIn().end().appendTo('.slideshow');
        }
            break;
    }
 });
});

Solution

  • Finaly find the solution ! Works perfectly

    Code :

    $(function() {
    var     timer;
    function autoplay() { 
        timer = setInterval(function() {
            $('.slideshow > :first-child').fadeOut().next().fadeIn().end().appendTo('.slideshow');
        }, 5000);
    }
    autoplay();
    $('#prev, #next').click(function() {
        switch (this.id) {
            case 'prev':
                clearInterval(timer); autoplay(); 
                $('.slideshow > :first-child').fadeOut();
                $('.slideshow > :last-child').fadeIn().prependTo('.slideshow');
                break;
            case 'next':
                clearInterval(timer); autoplay();
                $('.slideshow > :first-child').fadeOut().next().fadeIn().end().appendTo('.slideshow');
                break;
        }});});
    

    Thank you for support.