Zepto 中 swiper 簡單用法

Zepto

　　一個輕量級的針對現代高級瀏覽器的JavaScript庫，多用於開發移動端
　　　　zepto官網：http://zeptojs.com/
　　　　zepto中文api：http://www.css88.com/doc/zeptojs_api/
　　　　zepto自定義構建地址：http://github.e-sites.nl/zeptobuilder/

swiper使用方法：

　　#幻燈片效果實例，固定用法
　　<script type="text/javascript" src="js/zepto.min.js"></script>
　　<script type="text/javascript" src="js/swiper.jquery.min.js"></script>
　　......

　　<link rel="stylesheet" type="text/css" href="css/swiper.min.css">
　　......

　　<div class="swiper-container">
　　　　<div class="swiper-wrapper">
　　　　　　<div class="swiper-slide">slider1</div>
　　　　　　<div class="swiper-slide">slider2</div>
　　　　　　<div class="swiper-slide">slider3</div>
　　　　</div>
　　　　<div class="swiper-pagination"></div>
　　　　<div class="swiper-button-prev"></div>
　　　　<div class="swiper-button-next"></div>
　　</div>

　　<script>
　　　　var swiper = new Swiper('.swiper-container', {
　　　　　　pagination: '.swiper-pagination',
　　　　　　prevButton: '.swiper-button-prev',
　　　　　　nextButton: '.swiper-button-next',
　　　　　　initialSlide :1,
　　　　　　paginationClickable: true,
　　　　　　loop: true,
　　　　　　autoplay:3000,
　　　　　　autoplayDisableOnInteraction:false
　　　　});
　　</script>

　　#swiper使用參數：
　　　　一、initialSlide：初始索引值，從0開始
　　　　二、direction：滑動方向 horizontal | vertical
　　　　三、speed：滑動速度，單位ms
　　　　四、autoplay：設置自動播放及播放時間
　　　　五、autoplayDisableOnInteraction：用戶操做swipe後是否還自動播放，默認是true，再也不自動播放
　　　　六、pagination：分頁圓點
　　　　七、paginationClickable：分頁圓點是否點擊
　　　　八、prevButton：上一頁箭頭
　　　　九、nextButton：下一頁箭頭
　　　　十、loop：是否首尾銜接
　　　　十一、onSlideChangeEnd：回調函數，滑動結束時執行