Bootstrap4 轮播方法

这些是标准Bootstrap程序的轮播方法

传递选项

您还可以使用选项对象将选项传递给 carousel()方法。

以下示例将关闭轮播中的自动滑动。 默认情况下,Bootstrap 轮播会在页面加载时自动开始播放或滑动。

$(document).ready(function(){
    $("#myCarousel").carousel({
        interval : 3000
    });
});

尝试一下

.carousel('cycle')

此方法启动轮播以从左到右循环遍历项目。

(document).ready(function(){
   $(".start-slide").click(function(){
       $("#myCarousel").carousel('cycle');
   });
);

尝试一下

.carousel('pause')

此方法可阻止轮播在项目之间循环。

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

尝试一下

.carousel('number')

此方法可阻止轮播在项目之间循环。

(document).ready(function(){
   $(".slide-three").click(function(){
       $("#myCarousel").carousel(3);
   });
);

尝试一下

.carousel('prev')

此方法将轮播循环到前一项。

$(document).ready(function(){
    $(".prev-slide").click(function(){
        $("#myCarousel").carousel('prev');
    });
});

尝试一下

.carousel('next')

此方法将轮播循环到下一个项目

(document).ready(function(){
   $(".next-slide").click(function(){
       $("#myCarousel").carousel('next');
   });
);

尝试一下

查看笔记

扫码一下
查看教程更方便