Используя фреймворк twitter bootstrap, как можно вызвать карусель для автоматического слайда. Значение, которое загружается страницей, автоматически прокручивает карусель.
Я пробовал функцию javascript onLoad click для <a> следующей ссылки, но это не сработало.
вы должны сделать, поскольку Twitter Bootstrap Documentation говорит о Каруселе, поэтому установите первый элемент слайда карусели с class= "активным" и инициализируйте js для карусели таким образом:
$(function(){
$('.carousel').carousel({
interval: 2000
});
});
тогда, если этого недостаточно (но это никогда не случалось со мной), используйте команду bruteforce, запускающую щелчок на кнопках управления карусели следующим образом:
$(function(){
$('.carousel').carousel({
interval: 2000
});
$('.carousel-control.right').trigger('click');
});
но это всего лишь не необходимый трюк, действительно, просто следуйте за документацией!
Simple. Вам не хватает атрибута data-ride в div.
<div id="carousel-example-generic" class="carousel slide" data-ride="carousel">
Как для документов, вам нужно инициализировать плагин Карусель через JavaScript. Пример карусели на официальной странице документации Bootstrap инициализируется в файле application.js на строках 67-68:
// carousel demo
$('#myCarousel').carousel()
который дает ему настройки по умолчанию.
Если вы хотите указать интервал цикла, вы можете установить свойство interval в миллисекундах:
$('.carousel').carousel({
interval: 2000
})
Поместите его в готовый блок документа, чтобы он автоматически запускался для меня
$(document).ready(function() {
$('#myCarousel').carousel();
});
Вы можете использовать атрибут data-interval на разметке html для автоматического воспроизведения:
<div id="carousel-example-generic" class="carousel slide" data-ride="carousel" data-interval="5000">
интервал данных: количество времени в миллисекундах для задержки между автоматическим циклированием элемента. Если false, карусель автоматически не будет циклически переключаться.
<div id="myCarousel" class="carousel slide" data-ride="carousel"> работает для меня, то, что мне не хватало, был атрибут data-ride.
Надеюсь, это поможет многим людям. Спасибо, stackoverflow, вы были очень полезны для меня по большинству причин. Я рад, что это сообщество существует.
<header id="myCarousel" class="carousel slide">
ВАМ НУЖНО ДОБАВИТЬ
data-ride="carousel"
<header id="myCarousel" class="carousel slide" data-ride="carousel">
Просто добавьте класс "слайд" в тег div карусели, например:
<div class="carousel slide" id="this-carousel-id">