改变中间小圆点
“`
Bootstrap 实例 - 轮播(Carousel)插件方法
.btn{
width: 80px;
height: 30px;
background: #c00000;
color: #ffffff;
}
#new li{
background: #fff;
color: #c00000;
width: 100px;
height: 30px;
}
#new .active{
background: #c00000;
color: #fff;
width: 100px;
height: 30px;
}
<!-- 轮播(Carousel)项目 -->
<div class="carousel-inner">
<div class="item active">
<img src="../images/1.jpg" alt="First slide">
</div>
<div class="item">
<img src="../images/2.png" alt="Second slide">
</div>
<div class="item">
<img src="../images/1.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>-->
(function(){
// 初始化轮播(".start-slide").click(function(){
("#myCarousel").carousel('cycle');
});
// 停止轮播(".pause-slide").click(function(){
("#myCarousel").carousel('pause');
});
// 循环轮播到上一个项目(".prev-slide").click(function(){
("#myCarousel").carousel('prev');
});
// 循环轮播到下一个项目(".next-slide").click(function(){
("#myCarousel").carousel('next');
});
// 循环轮播到某个特定的帧(".slide-one").click(function(){
(this).addClass(′new′).siblings().removeClass(′new′); ("#myCarousel").carousel(0);
});
(".slide-two").click(function(){
$(this).addClass('new').siblings().removeClass('new');
$("#myCarousel").carousel(1);
});(".slide-three").click(function(){
(this).addClass(′new′).siblings().removeClass(′new′); ("#myCarousel").carousel(2);
});
});
“`