当用户点击指标或轮播控件时，如何禁用轮播周期？

Question

使用Bootstrap现成的轮播，我想在用户点击指示器或控件（下一个/上一个按钮）时禁用自动循环功能。因此，如果用户点击“下一步”按钮，旋转木马现在将是手动的。在jQuery中不强，但这是我的尝试。

$('#myCarousel').click(function() {
    $(this).stop();
});

Answer 1

您可以通过轮播的interval对象访问.data()选项，并将其设置为false ..

$('#myCarousel').click(function() {
  $(this).data('carousel').options.interval=false;
});

演示：http://www.bootply.com/65091

Answer 2

对于Bootstrap 3，我做了类似的事情。注意：我的页面的很大一部分都被轮播覆盖，所以我告诉它不要暂停悬停（因为可能性是鼠标已经在盘旋）。

要暂停，在任何地方点击轮播（包括指示符）：

$('#myCarousel').click(function () {
        $('#myCarousel').carousel('pause');
});

要仅在单击指示符时暂停，它将是这样的。对于其他元素也是如此。

$(".carousel-indicators").click(function () {
        $('#myCarousel').carousel('pause');
});

不是直接在问题的范围内，但这是我如何阻止它暂停鼠标悬停：

$('#myCarousel').carousel({
        pause: "false"
});