Как добавить класс active, когда слайд активен?

Рейтинг: 0Ответов: 1Опубликовано: 04.02.2023

Есть слайдер и необходимо на активный слайд, добавить класс active. Подскажите как это можно реализовать через jQuery??

<div class="carousel-inner">
      <div class="carousel-item">
            <img class="w-100" src="img/carousel-1.jpg" alt="Image">
      </div>
      <div class="carousel-item">
            <img class="w-100" src="img/carousel-2.jpg" alt="Image">
      </div>

Ответы

▲ 0Принят

Если вы используете готовую библиотеку с инициализацией слайдера, то там это уже реализовано. Почитайте докуметацию. Если это самодельный слайдер, то просто на первый элемент добавьте.

$(".carousel-item").eq(0).addClass("active");
.carousel-item.active{
  border:1px solid #000;
  
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="carousel-inner">
      <div class="carousel-item">
            <img class="w-100" src="img/carousel-1.jpg" alt="Image">
      </div>
      <div class="carousel-item">
            <img class="w-100" src="img/carousel-2.jpg" alt="Image">
      </div>
      </div>