如何運用swiper

<div class="swiper-container">
<div class="swiper-wrapper">
<div class="swiper-slide"></div>
<div class="swiper-slide"></div>
<div class="swiper-slide"></div>
<div class="swiper-slide"></div>
</div>
</div>

 

var mySwiper = new Swiper(".swiper-container",{

})

函數【可用做屬性使用】：
onSlideChangeEnd(swiper):function(){...} 從一個slide過渡到另外一個slide結束時執行
onSliderMove(swiper, event):function(){...} 手指觸碰Swiper並拖動slide時執行。

經常使用： 直接使用，函數中使用fun(sw){ sw.activeIndex }
mySwiper.activeIndex： 返回當前活動塊的索引
mySwiper.initialSlide 初始化索引

屬性：
slidesPerView: 顯示數量
spaceBetween： 間距
centeredSlides：true 活動塊居中
freeMode： 自動貼合【false:貼合 true：不貼合】

slideToClickedSlide： 點擊跳到點擊時的slide
slidesOffsetBefore： 距離左邊框偏移量
slidesOffsetAfter： 距離右邊框偏移量
direction： 滑動方向，水平【horizontal】或垂直【vertical】
speed： 滑動速度，觸摸滑動時釋放至貼合的時間【單位：ms】
autoplay： 自動切換的時間間隔【單位ms】，不設定該參數slide不會自動切換
observer：true 實時監聽slide被修改
threshold：【單位px】 當拖動小於時，不會被拖動
loop：true 追加，看起來像無縫輪播
autoHeight：true 自動撐開高度，總體高度改變

輪播、選項卡
paginationClickable:true 點擊分頁器的指示點分頁器會控制Swiper切換
pagination:"指示點容器" 顯示指示點【指示點容器能夠在swiper容器外】
loop：true 追加，看起來像無縫輪播