心平凡，自不凡
我时常想象自己沿着视野里的湖边一遍一遍的走着，看着春天的枝叶发出新芽，夏天里漫天飞舞的柳絮，秋日里被寒霜染红的落叶，冬日里最最欣喜的漫山遍野的雪景，料想这原本就是自己的一生，但自从遇见了不安，便让自己脱离里梦境，游走在时间与欲望的边缘，时而快乐着时而忧伤着的挥霍自己的青春。
一、dom结构
//swiper-container锚，不能修改名称
1、<div class="swiper-container">
<div class="swiper-wrapper">
<div class="swiper-slide">Slide 1</div>
<div class="swiper-slide">Slide 2</div>
<div class="swiper-slide">Slide 3</div>
<div class="swiper-slide">Slide 4</div>
<div class="swiper-slide">Slide 5</div>
<div class="swiper-slide">Slide 6</div>
<div class="swiper-slide">Slide 7</div>
<div class="swiper-slide">Slide 8</div>
<div class="swiper-slide">Slide 9</div>
<div class="swiper-slide">Slide 10</div>
</div>、
//分页开始
<div class="swiper-pagination"></div>
</div>
2、Swiper 配置
<!-- Initialize Swiper -->
<script>
var mySwiper = new Swiper ('.swiper-container', {
direction: 'horizontal', //滚动方向控制
loop: false,//是否循环滚动
pagination: '.swiper-pagination',//是否分页
//其他配置选项区域
})
</script>
二、参数说明
1、direction:'horizontal',
//滚动方向
horizontal:水平
vertical：垂直
2、loop: false,
//是否轮询显示
true:轮询显示
false：不轮询显示
3、pagination: '.swiper-pagination',
//是否分页
pagination: '.swiper-pagination',
//添加及显示
需要在<div class="swiper-container">容器中最后一行前添加
//分页开始
<div class="swiper-pagination"></div>
4、autoplay: 5000,
//可选选项，自动滑动，添加即按照时间自动切换
setInterval("mySwiper.slidePrev()", 2000);
//反向滑动
5、initialSlide :2,
//轮播图片索引（即轮播图片的个数）
initialSlide参数
类型：number默认：0举例：2
6、speed:1000,
//speed参数
类型：number默认：300 举例：1000
7、autoplayDisableOnInteraction
//用户操作swiper之后，是否禁止autoplay。默认为true：停止。
//如果设置为false，用户操作swiper之后自动切换不会停止，每次都会重新启动autoplay。
//操作包括触碰，拖动，点击pagination等。
类型：boolean默认：true举例：false
8、autoplayStopOnLast
//如果设置为true，当切换到最后一个slide时停止自动切换。（loop模式下无效）。
类型：boolean默认：false举例：true启用版本：3.3.0
9、grabCursor
//设置为true时，鼠标覆盖Swiper时指针会变成手掌形状，拖动时指针会变成抓手形状。（根据浏览器形状有所不同）
类型：boolean默认：false举例：true
10、roundLengths
//设定为true将slide的宽和高取整(四舍五入)以防止某些分辨率的屏幕上文字或边界(border)模糊。
例如在1440宽度设备上，当你设定slide宽为76%时，则计算出来结果为1094.4，开启后宽度取整数1094。
roundLengths参数
类型：boolean默认：false举例：true启用版本：3.1.0
11、autoHeight
//自动高度。设置为true时，wrapper和container会随着当前slide的高度而发生变化。
autoHeight参数
类型：boolean默认：false举例：true启用版本：3.2.5