@purpleflower

Как сделать, чтобы слайд автоматически переключался через 5 секунд?

Есть слайдер. У него настроено автопереключение через каждые 5 секунд. Но(!) если пользователь сам перелистнёт картинку, следующая включится уже не через 5, а через 2,5 сек, или даже меньше.

В идеале нужно сделать так, чтобы в любом случае, даже после нажатия кнопки, слайды автоматически листались ровно по 5 сек каждый. Поможете?

Код здесь: codepen.io/anon/pen/PvePqg
/*Временно отключён setInterval, когда пользователь переключает фотографии самостоятельно, надо было пофиксить на скорую руку*/
  • Вопрос задан
  • 145 просмотров
Решения вопроса 1
john36allTa
@john36allTa
alien glow of a dirty mind
Так будет лучше, мне кажется:
const feedbackSlider = () => {
    let slideIndex = 1,
        items = document.querySelectorAll(".feedback-slider-item"),
        prev = document.querySelector(".main-prev-btn"),
        next = document.querySelector(".main-next-btn");

    const showSlides = (n) => {
        if (n > items.length) {
            slideIndex = 1;
        }
        if (n < 1) {
            slideIndex = items.length;
        }
        items.forEach((item) => {
            item.classList.add("animated");
            item.style.display = "none";
        });
        items[slideIndex - 1].style.display = "block";
    }

    const plusSlides = (n, auto=false) => {
        showSlides(slideIndex += n);
        if (!auto) { 
        	clearInterval(sliderInterval);
        	sliderInterval = timer();
        }
        items[slideIndex - 1].classList.remove(n>0?"slideInRight":"slideInLeft");
        items[slideIndex - 1].classList.add(n>0?"slideInLeft":"slideInRight");  
    }
    showSlides(slideIndex);
    prev.addEventListener("click", () => { plusSlides(-1 ) });
    next.addEventListener("click", () => { plusSlides( 1 ) });
    const timer = () => setInterval(()=> { plusSlides(1,1) }, 5000);
    let sliderInterval = timer();
}
Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы