Question

I have this code which auto plays my slider, how ever at the the last slide it just stops. How do I get it to start from the the beginning after the last slide.
Thank You

I have a slider which uses the following buttons for navigation. How would I add an autoplay feature to this – SetTimeout function?

Thanks

// Next Clicked jQuery('.ajax-next').click(function(){

        if ( jQuery(".ajax-portfolio-window").is(':animated') || jQuery(".ajax-portfolio-image-wrap").is(':animated') ) return;

        var total = jQuery('.portfolio-ajax').length;
        var index = jQuery('.ajax-gallery-navigation').attr("id");

        currindex=parseInt(index);
        nextIndex=currindex+1;
        if (nextIndex!=total) {
            jQuery('.portfolio-ajax').eq(nextIndex).trigger('click');
        }

        return false;


    });



    // Clicked Prev 

    jQuery('.ajax-prev').click(function(){

        if ( jQuery(".ajax-portfolio-window").is(':animated') || jQuery(".ajax-portfolio-image-wrap").is(':animated') ) return;

        var index = jQuery('.ajax-gallery-navigation').attr("id");
        if (index=='-1') { index='0'; }
        currindex=parseInt(index);
        prevIndex=currindex-1;
        if (prevIndex!=-1) {
            jQuery('.portfolio-ajax').eq(prevIndex).trigger('click');
        }

        return false;
    }); 
}

// Autoplay

setInterval(function(){
        // do you stuff here. for example
        jQuery('.ajax-next').click();
            }, 10000); // 10 sec interval

Answer 1

I’m not usre about your html markup, but you can simplify your code next() and prev().

Anyway, in your case to loop your slider you need to set index to 0 if you reached total. So:

    if (nextIndex!=total) {
        jQuery('.portfolio-ajax').eq(nextIndex).trigger('click');
    }

should be changed to:

    if (nextIndex == total - 1) {
        nextIndex = 0
    }
    jQuery('.portfolio-ajax').eq(nextIndex).trigger('click');