关于boostrap的轮播(Carousel)插件不能自动播放的问题

近段时间,我按照w3c上boostrap的教程写轮播,写完发现这个轮播不能自动播放,需要手工点击到上一张或者下一张的图片后,才能自动播放,经过上网查资料才发现,w3c上的代码少了一个重要的地方:

< div id = "myCarousel" class = "carousel slide" data-ride="carousel" >
<!-- w3c中的轮播代码少了 data-ride="carousel" 所以不能自动播放,需要点击后才可以自动播放 -->
<!-- 轮播(Carousel)指标 -->
< ol class= "carousel-indicators" >
< li data-target= "#myCarousel" data-slide-to= "0" class= "active" ></ li >
< li data-target= "#myCarousel" data-slide-to= "1" ></ li >
< li data-target= "#myCarousel" data-slide-to= "2" ></ li >
</ ol >
<!-- 轮播(Carousel)项目 -->
< div class= "carousel-inner" >
< div class= "item active" >
< img src= "./images/ph (1).jpg" alt= "First slide" >
</ div >
< div class= "item" >
< img src= "./images/ph (2).jpg" alt= "Second slide" >
</ div >
< div class= "item" >
< img src= "./images/ph (3).jpg" alt= "Third slide" >
</ div >
</ div >
<!-- 轮播(Carousel)导航 -->
< a class= "carousel-control left" href= "#myCarousel" data-slide= "prev" ></ a >
< a class= "carousel-control right" href= "#myCarousel" data-slide= "next" ></ a >
</ div >

加上这个:
data-ride= "carousel"
轮播图就可以不用操作自动播放了。

评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值