Bootstrap 轮播(Carousel)插件

2020-06-18 06:00:57易采站长站整理
number
默认值:5000data-interval自动循环每个项目之间延迟的时间量。如果为 false,轮播将不会自动循环。pausestring
默认值:"hover"data-pause鼠标进入时暂停轮播循环,鼠标离开时恢复轮播循环。wrapboolean
默认值:truedata-wrap轮播是否连续循环。

方法

下面是一些轮播(Carousel)插件中有用的方法:

方法描述实例
.carousel(options)初始化轮播为可选的 options 对象,并开始循环项目。
$('#identifier').carousel({
    interval: 2000
})
.carousel('cycle')从左到右循环轮播项目。
$('#identifier').carousel('cycle')
.carousel('pause')停止轮播循环项目。
$('#identifier').carousel('pause')
.carousel(number)循环轮播到某个特定的帧(从 0 开始计数,与数组类似)。
$('#identifier').carousel(number)
.carousel('prev')循环轮播到上一个项目。
$('#identifier').carousel('prev')
.carousel('next')循环轮播到下一个项目。
$('#identifier').carousel('next')

实例

下面的实例演示了方法的用法:

实例

 

First slide Second slide Third slide




Previous



Next


$(function(){
// 初始化轮播
$(".start-slide").click(function(){
$("#myCarousel").carousel('cycle');
});
// 停止轮播
$(".pause-slide").click(function(){
$("#myCarousel").carousel('pause');
});
相关文章 大家在看