1

Есть такая структура

<div class='wrapper'>
<div class='slide active'></div>
<div class='slide'></div>
<div class='slide'></div>
<div class='slide'></div>
<div class='slide'></div>
</div>

надо что бы каждый 10 секунд, у прошлого удалялся класс active и у след. добавлялся, если дошел до конца переходит к первому( зациклен)

1
  • Почему бы не использовать готовый слайдер? Или можете воспользоваться многочисленными уроками по созданию собственных сайдеров на Jquery или без него 4 фев 2018 в 10:58

1 ответ 1

3

Как то так?

function slideShow(){
    var $next = $(".slide.active").next(".slide");
    $(".slide.active").removeClass('active');
    if(!$next.length) $next = $(".slide").eq(0);
    
    $next.addClass('active');
}


setInterval(slideShow, 3000);
.slide {
   display: none;
   color: red;
}

.slide.active {
  display: block;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class='wrapper'>
   <div class='slide active'>slide-1</div>
   <div class='slide'>slide-2</div>
   <div class='slide'>slide-3</div>
   <div class='slide'>slide-4</div>
   <div class='slide'>slide-5</div>
</div>

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge you have read our privacy policy.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.