Skip to main content
1 de 2
DontVoteMeDown
  • 2,6mil
  • 15
  • 23

Mudei seu código um pouco:

var interval = setInterval(function(){
    change("next");
}, 3000);

var change = function(fn) {
    $ds.filter(':visible').fadeOut(function(){
        var $div = $(this)[fn]('.article-inform');
        if ( $div.length == 0 ) {
            $ds.eq(0).fadeIn();
        } else {
            $div.fadeIn();
        }
    });
};

$(".preview .prev").on("click", function() {
    window.clearInterval(interval);
    change("prev");
});

$(".preview .next").on("click", function() {
    window.clearInterval(interval);
    change("next");
});

Fiddle

Coloquei a mudança de slides em uma função chamada change, que recebe o nome da função que vai buscar o próximo slide, podendo ser prev ou next:

$(this)[fn]('.article-inform');

Fora isso, fiz o controle de slides parar o intervalo quando uma ação do usuário muda o slide. Acho que é o comportamento padrão, se não ia ficar bagunçado, com o intervalo mudando o slide junto com a ação do usuário. Dá pra fazer o intervalo iniciar novamente após a ação, se preferir.

DontVoteMeDown
  • 2,6mil
  • 15
  • 23