Как изменить интервал времени на карусельной загрузке?

У меня есть карусель для начальной загрузки на моей веб-странице, я пытаюсь увеличить временной интервал между каждым слайдом. Задержка по умолчанию 5000 миллисекунд слишком быстрая, мне нужно около 10 секунд.

Ответ 1

Вы можете использовать параметры при инициализации карусели, например:

// interval is in milliseconds. 1000 = 1 second -> so 1000 * 10 = 10 seconds
$('.carousel').carousel({
  interval: 1000 * 10
});

или вы можете использовать атрибут interval непосредственно в теге HTML, например:

<div class="carousel" data-interval="10000">

Преимущество последнего подхода заключается в том, что вам не нужно писать JS для него, в то время как преимущество первого заключается в том, что вы можете вычислить интервал и инициализировать его значением переменной во время выполнения.

Ответ 2

Вы также можете использовать атрибут интервала данных, например. <div class="carousel" data-interval="10000">

Ответ 3

        You need to set interval in  main div as data-interval tag .
        so it is working fine and you can give different time to different slides.

       <!--main div -->
      <div data-ride="carousel" class="carousel slide" data-interval="100" id="carousel-example-generic">
  <!-- Indicators -->
  <ol class="carousel-indicators">
                                <li data-target="#carousel-example-generic" data-slide-to="0" class=""></li>
                             i>
                                            </ol>

  <!-- Wrapper for slides -->
  <div role="listbox" class="carousel-inner">
       <div class="item">
          <a class="carousel-image" href="#">
           <img alt="image" src="image.jpg">
          </a>
        </div>
    </div>
 </div>