Предотвращение автоматического скольжения карусели twitter bootstrap при загрузке страницы

119

Так есть ли способ предотвратить автоматическое скольжение карусели twitter bootstrap при загрузке страницы, если не нажата следующая или предыдущая кнопка?

Спасибо

jquery twitter-bootstrap carousel Тепкен Ваннкорн
источник

263

Или, если вы используете Bootstrap 3.0, вы можете остановить цикл, например, с помощью data-interval = "false"

<div id="carousel-example-generic" class="carousel slide" data-interval="false">

Другие полезные атрибуты данных карусели находятся здесь -> http://getbootstrap.com/javascript/#carousel-usage

Михал Копец
источник

4

Это не стопроцентный ответ на вопрос, потому что он также предотвращает циклическое переключение даже при нажатии кнопки. Но это было именно то, что я искал. Так что все равно спасибо!

Tillito

3

data-interval="false"также работает с Bootstrap 4

Ionuț Ciuta

53

Собственно, проблема решена. Я добавил аргумент «пауза» в метод «карусель», как показано ниже:

$(document).ready(function() {      
   $('.carousel').carousel('pause');
});

В любом случае, большое спасибо @Yohn за советы по поводу этого решения.

Тепкен Ваннкорн
источник

8

Это начнет скользить после prev / next, посмотрите stackoverflow.com/a/18208327/463065, если это не то, что вы ищете.

Trufa

для более конкретного $(function(){ $("#idName").carousel('pause'); });

Роджер

43

Решена проблема с автоматическим скольжением карусели после нажатия кнопки назад / вперед.

$('.carousel').carousel({
    pause: true,
    interval: false
});

GitHub коммит 78b927b

Srnux
источник

17

если вы используете bootstrap 3, установленный data-interval="false"в структуре HTML карусели

пример:

<div id="carousel-example-generic" class="carousel slide" data-ride="carousel" data-interval="false">

marciocst
источник

10

Используйте data-interval="false"для остановки автоматического слайда
Используйте data-wrap="false"для остановки кругового скольжения

Анил Рам
источник

10

добавьте это в свой div Coursel:

data-interval="false"

Дилан Б.
источник

Ответ Майкла Копека от 2 лет назад уже говорит об этом.

All Workers Are Essential

5

Ниже приведен список параметров загрузочной карусели. Например, интервал, пауза, перенос:

Для получения дополнительной информации перейдите по этой ссылке:

http://www.w3schools.com/bootstrap/bootstrap_ref_js_carousel.asp

Надеюсь, что это поможет вам :)

Примечание: это дополнительная помощь. Я имею в виду, как вы можете настроить или изменить поведение по умолчанию после загрузки карусели.

Викаш Пандей
источник

2

Я думаю, может быть, вам стоит проверить официальную инструкцию по карусели, для меня я не нашел ответа выше, из-за нескольких версий начальной загрузки я использую b4-alpha и хочу, чтобы эффект автозапуска остановился.

$(document).ready({
    pause:true,
    interval:false
});

этот скрипт не работает, пока мышь покидает эту страницу, а именно область карусели. перейдите к официальному определению и найдите те:

Итак, вы поймете, почему. Если срабатывает событие карусели onmouseover, страница приостанавливается, а когда указатель мыши выходит за пределы этой страницы, она возобновляется снова.

Итак, если вы хотите, чтобы страница останавливалась навсегда и вращалась вручную , вы можете просто установить data-interval='false'.

Crabime
источник

1

--Используйте data-interval = "false", чтобы остановить автоматическое скольжение. --Используйте data-wrap = "false", чтобы остановить круговое скольжение.

...

Анил Кумар Рам
источник

1

Для Bootstrap 4 просто удалите 'data-ride = "carousel"' из div-карусели. Это убирает автоматическое воспроизведение во время загрузки.

Чтобы снова включить автоматическое воспроизведение, вам все равно придется использовать вызов «play» в javascript.

Джеймс
источник

Предотвращение автоматического скольжения карусели twitter bootstrap при загрузке страницы

Ответы: