Question

有没有办法在没有自动循环的情况下初始化Twitter Bootstrap Carousel？设置interval: false最初不会循环，但是一旦您点击next或prev，它就会再次开始循环。我根本不希望它循环。

修改

这是我用来初始化它的jquery代码：

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

要在轮播中显示图像：

image_tag('image.png', :'data-target' => '#carousel', :'data-slide-to' => 1)

Answer 1

您可以通过将data-interval="false"添加到.carousel div标记来停止Bootstrap的轮播在页面加载时循环播放。（我无法获得上述任何一种解决方案。）

Answer 2

我认为您正在寻找“数据包装”参数

<div id="crsl1" class="carousel slide" data-ride="carousel" data-wrap="false">
  ...
</div>

Answer 3

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

或者如果仍然没有这样做，请尝试：

$('#carousel').carousel({interval: false});
$(document).on('mouseleave', '#carousel', function() {
    $(this).carousel('pause');
});

重置mouseleave事件的暂停。

Answer 4

您可以停止轮播事件并手动控制滑动

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

    $(document).off('.bs.carousel.data-api');

    $('#carousel a').on('click', function (ev) {
        if ( $(ev.currentTarget).hasClass('right')) {
            $('#carousel').carousel('next');
        }

        if ( $(ev.currentTarget).hasClass('left')) {
            $('#carousel').carousel('prev');
        }
    })
});

Answer 5

试试这个：

 data-ride="carousel" remove from carousel and $('#carousel-example-generic').carousel({interval: false})

Answer 6

我现在忘记了相同的简单细节。这是非常简单的兄弟，但正如我所见，问题仍然悬而未决。这样就可以了：

只需在轮播元素的主div处添加data-wrap =“ false”，

;）

Twitter Bootstrap Carousel - 不要循环

6 个答案: