Загрузочный JavaScript JavaScript не работает

Ответ 1

Возможно, вы захотите удалить атрибут "пауза". Это не обязательно, если вы не автоматически ездите на велосипеде по изображениям. Мое предположение (и я собираюсь проверить код начальной загрузки для проверки) заключается в том, что когда происходит событие "mouseleave", циклическое возобновление - даже если оно было отключено в первую очередь. Когда он возобновляется, он использует скорость по умолчанию.

Вот решение:

$(function() {
    $('.carousel').each(function(){
        $(this).carousel({
            interval: false
        });
    });
});​

Ответ 2

Чтобы отключить циклирование, одним рабочим решением является добавление в контейнер карусели data-interval = "false":

<div id="myCarousel" class="carousel slide" data-interval="false">
    <div class="carousel-inner">
        <div class="active item">toto</div>
        <div class="item">tata</div>
        <div class="item">tutu</div>
    </div>
    <a class="carousel-control left" href="#myCarousel" data-slide="prev">&lsaquo;</a>
    <a class="carousel-control right" href="#myCarousel" data-slide="next">&rsaquo;</a>                                                                        
</div>

Ответ 3

Я только что придумал решение этой проблемы. Ни одно из вышеперечисленных не работало для меня, но это заставило меня взглянуть на код начальной загрузки. Я считаю, что причина этой ошибки в файле bootstrap-carousel.js в объекте по умолчанию:

  $.fn.carousel.defaults = {
    interval: 5000
  , pause: 'hover'
  }

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

  $.fn.carousel.defaults = {
    interval: false
  , pause: 'hover'
  }

Ответ 4

Я не уверен, почему, но основное решение не сработало и для меня. Weird.

Чтобы исправить мою проблему, я сделал следующий код.

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

$(document).on('mouseleave', '.carousel', function() {

    $(this).carousel('pause');
});

Смотрите документацию для carouselpause.

Ответ 5

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

http://getbootstrap.com/javascript/#carousel

Ответ 6

Кроме того, что предлагает @dgabriel, убедитесь, что вызов JavaScript, инициализирующий карусель Bootstrap, ПОСЛЕ <script> ссылок на jQuery, bootstrap-transition.js и bootstrap-carousel.js, примерно так:

<script type="text/javascript" src="http://twitter.github.com/bootstrap/assets/js/jquery.js"></script>
<script type="text/javascript" src="http://twitter.github.com/bootstrap/assets/js/bootstrap-transition.js"></script>
<script type="text/javascript" src="http://twitter.github.com/bootstrap/assets/js/bootstrap-carousel.js"></script>

<script type="text/javascript">
$(document).ready(function() {
    $('.gallery-carousel').each(function(){
        $(this).carousel({
            interval: false
        });
    });
});
</script>

Это гарантирует, что карусель работает по назначению (например, ошибки Uncaught ReferenceError: $ is not defined (anonymous function).

Ответ 7

Я все пробовал, но ничего не получилось. Я решил проблему при изменении файлов bootstrap.min.js и bootstrap.js. Вы должны искать "carousel.defaults" с помощью Ctrl + F в этих файлах и заменять их:

interval:false 

Ответ 8

Я думаю, что ответ @dgabriel должен работать, потому что:

Метод bootstrap carousel pause() не рассматривает свой аргумент так, как вы думаете. пауза (true) не означает "да, приостановите ее", и пауза (ложь) означает "нет, не останавливайте ее".

это можно увидеть в исходном коде,

Carousel.prototype.pause = function (e) {
  e || (this.paused = true)
  ...
  this.interval = clearInterval(this.interval)

  return this
}

github link здесь

как можно видеть, если e истинно, this.paused = true не будет выполняться. поэтому, когда срабатывает событие "mouseleave", метод cycle() все еще видит "paused == false", а setInterval выполняется снова, поэтому ваша карусель не останется неподвижной.

// mouseleave event fires using cycle() with no arguments
.on('mouseleave', $.proxy(this.cycle, this))

// so when cycle() is called, this.paused == false.
Carousel.prototype.cycle =  function (e) {
  e || (this.paused = false)

  this.interval && clearInterval(this.interval)

  // set interval == false to prevent setInterval
  this.options.interval
    && !this.paused
    && (this.interval = setInterval($.proxy(this.next, this), this.options.interval))

  return this
}

чтобы приостановить, используйте .pause() и interval=false, чтобы предотвратить перезагрузку события "mouseleave". сам bootstrap использует его таким образом, его можно увидеть здесь

Ответ 9

Собственно, изменение настроек по умолчанию в bootstrap-carousel.js следующим образом помогло мне.

Carousel.DEFAULTS = {
    interval: false,
    pause: 'hover',
    wrap: false
  }

Ответ 10

У меня тоже есть проблема с Stop bootstrap Carousel от автоматического воспроизведения. Я проверил файл bootstrap.js, и я нашел коды, относящиеся к карусели то я удаляю другой js. В новом js файле я делаю копию из всех кодов, а затем меняю переменную Carousel на Carousel_n (потому что можно изменить ее на все, что вы хотите). В последней строке кодов самое главное:

 {  $('[data-ride="carousel"]').each(function () }

Я меняю carousel на Carousel_n.

для html Я только изменил:

<div id="Carousel" class="carousel slide" data-ride="carousel">

to

<div id="Carousel" class="carousel slide" data-ride="carousel_n">

и, конечно же, это действительно сработало.

Ответ 11

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