Return to the JS slide

Question

Good morning! I apologize for the title but I didn’t find any better...
Well I have a page that shows the content in "slides", or at the beginning shows the slide 1, and by pressing the next arrow shows the next (slide 2).

To make it clearer see here - https://jsfiddle.net/f319gbwk/8/ (expand the square of the result).

What I intended now is that after I passed the last slide, instead of leaving that page blank, I would go back to 1 slide, I experimented with while, for but I couldn’t implement...
Thanks to those who can help!

Answer 1

It’s almost over there! If you had animations, you would have to change a little what you already have, but, as (at least for now) you don’t, just change your conditions that change to var current and add a else.

When you want to slide right, check if you are already on the last slide, and if you are, send it back to the first one current = 0. When you do it left, it’s the opposite check, if you’re on the first slide, send it to the last, current = sliderImages.length - 1 (-1 because the array has Indice 0).

Stay like this.

//Mostrar anterior
function slideLeft() {
    reset();
    if (current > 0) { // aqui fica igual
        current--;
    } else { // mas caso current seja 0, entao é o primeiro slide, temos de mandar para o último
        current = sliderImages.length - 1;
    }

    sliderImages[current].style.display = "block";
}

// Mostrar seguinte
function slideRight() {
    reset();
    if (current < sliderImages.length - 1) { // aqui temos de adicionar o -1 para comparar que current é 3 (posicao do ultimo slide no array)
        current++;
    } else { // e adicionamos o else para mandar para o primeiro
        current = 0;
    }

    sliderImages[current].style.display = "block";
}