carouseljs自動輪播

1. Bootstrap如何實現觸屏左右滑動輪播

我自己寫的BS輪播加手勢滑動，引入了一個插件，直接看代碼吧：

js">//引入插件
<linkhref="css/bootstrap.min.css"rel="stylesheet">
<scriptsrc="js/jquery.min.js"></script>
<scriptsrc="js/bootstrap.min.js"></script>
<scriptsrc="js/jgestures.min.js"></script>

JS代碼：

<script>
$(document).ready(function(){
	//手勢右滑回到上一個畫面
	$('#myCarousel').bind('',function(){
	$("#myCarousel").carousel('prev');
})
	//手勢左滑進入下一個畫面
	$('#myCarousel').bind('',function(){
		$("#myCarousel").carousel('next');
})
})
</script>

HTML代碼：

<divid="myCarousel"class="carouselslidepad_010b_k"data-ride="carousel">
			<!--輪播（Carousel）指標-->
			<olclass="carousel-indicators">
			<lidata-target="#myCarousel"data-slide-to="0"class="active"></li>
			<lidata-target="#myCarousel"data-slide-to="1"></li>
			<lidata-target="#myCarousel"data-slide-to="2"></li>
			</ol>
			<!--輪播（Carousel）項目-->
			<divclass="carousel-innerbor_btm">
			<divclass="itemactive">
			<divclass="rowmarg_0pad_t_10">
						<divclass="col-xs-3nav_tag_ico">
							<imgsrc="images/yule.png"width="70%">
							<pclass="nav_tag_t">娛樂</p>
						</div>
						<divclass="col-xs-3nav_tag_ico">
							<imgsrc="images/huodong.png"width="70%">
							<pclass="nav_tag_t">活動</p>
						</div>
						<divclass="col-xs-3nav_tag_ico">
							<imgsrc="images/tuangou.png"width="70%">
							<pclass="nav_tag_t">團購</p>
						</div>
						<divclass="col-xs-3nav_tag_ico">
							<imgsrc="images/huiyuanka.png"width="70%">
							<pclass="nav_tag_t">會員卡</p>
						</div>
						<divclass="col-xs-3nav_tag_ico">
							<imgsrc="images/meishi.png"width="70%">
							<pclass="nav_tag_t">美食</p>
						</div>
						<divclass="col-xs-3nav_tag_ico">
							<imgsrc="images/dianying.png"width="70%">
							<pclass="nav_tag_t">電影</p>
						</div>
						<divclass="col-xs-3nav_tag_ico">
							<imgsrc="images/jiudian.png"width="70%">
							<pclass="nav_tag_t">酒店</p>
						</div>
						<divclass="col-xs-3nav_tag_ico">
							<imgsrc="images/waimai.png"width="70%">
							<pclass="nav_tag_t">外賣</p>
						</div>
					</div>
			</div>
			<divclass="item">
			<divclass="rowmarg_0pad_t_10">
						<divclass="col-xs-3nav_tag_ico">
							<imgsrc="images/qinzi.png"width="70%">
							<pclass="nav_tag_t">親子</p>
						</div>
						<divclass="col-xs-3nav_tag_ico">
							<imgsrc="images/zuliao.png"width="70%">
							<pclass="nav_tag_t">足療按摩</p>
						</div>
						<divclass="col-xs-3nav_tag_ico">
							<imgsrc="images/jingdian.png"width="70%">
							<pclass="nav_tag_t">景點</p>
						</div>
						<divclass="col-xs-3nav_tag_ico">
							<imgsrc="images/jia.png"width="70%">
							<pclass="nav_tag_t">到家</p>
						</div>
						<divclass="col-xs-3nav_tag_ico">
							<imgsrc="images/yundong.png"width="70%">
							<pclass="nav_tag_t">運動健身</p>
						</div>
						<divclass="col-xs-3nav_tag_ico">
							<imgsrc="images/gouwu.png"width="70%">
							<pclass="nav_tag_t">購物</p>
						</div>
						<divclass="col-xs-3nav_tag_ico">
							<imgsrc="images/KTV.png"width="70%">
							<pclass="nav_tag_t">KTV</p>
						</div>
						<divclass="col-xs-3nav_tag_ico">
							<imgsrc="images/jiehun.png"width="70%">
							<pclass="nav_tag_t">結婚</p>
						</div>
					</div>
			</div>
			<divclass="item">
				<divclass="rowmarg_0pad_t_10">
						<divclass="col-xs-3nav_tag_ico">
							<imgsrc="images/chongwu.png"width="70%">
							<pclass="nav_tag_t">寵物</p>
						</div>
						<divclass="col-xs-3nav_tag_ico">
							<imgsrc="images/aiche.png"width="70%">
							<pclass="nav_tag_t">愛車</p>
						</div>
						<divclass="col-xs-3nav_tag_ico">
							<imgsrc="images/youhui_002.png"width="70%">
							<pclass="nav_tag_t">優惠</p>
						</div>
						<divclass="col-xs-3nav_tag_ico">
							<imgsrc="images/yanchu.png"width="70%">
							<pclass="nav_tag_t">演出</p>
						</div>
						<divclass="col-xs-3nav_tag_ico">
							<imgsrc="images/kafei.png"width="70%">
							<pclass="nav_tag_t">咖啡廳</p>
						</div>
						<divclass="col-xs-3nav_tag_ico">
							<imgsrc="images/jiaoyu.png"width="70%">
							<pclass="nav_tag_t">教育培訓</p>
						</div>
						<divclass="col-xs-3nav_tag_ico">
							<imgsrc="images/jiazhuang.png"width="70%">
							<pclass="nav_tag_t">家裝</p>
						</div>
						<divclass="col-xs-3nav_tag_ico">
							<imgsrc="images/qita.png"width="70%">
							<pclass="nav_tag_t">全部分類</p>
						</div>
					</div>
			</div>
			</div>
		</div>

CSS代碼就自己寫吧，相信難不倒你