一般属性
》direction:horizontal(默认)/vertical(垂直滑动)//slide滑动方向
》loop:true(默认)/false //可选选项,是否循环
》autoplay:具体时间ms//可选选项,自动滑动,其中实现反向自动滑动
setInterval("mySwiper.slidePrev()", 1000);
》autoplayDisableOnInteraction:true(默认)/false//用户操作(包括触碰,拖动,点击pagination等)swiper时,是否停止自动播放
》speed:具体时间ms//slider从开始到结束滑动的时间
》initialSlide://初始化时slide的索引
》grapCursor://鼠标经过swiper时变成手状,
》hashnav://类似锚点的功能,配合data-hash使用,当切换页面是url会带上data-hash里的值,可用于切换时初始化显示指定的页面
》parallax:true/false(默认)//开启视觉查效果,配合data-swiper-parallax(也可通过data-swiper-parallax-x或data-swiper-parallx-y单独设),data-swiper-parallax-duration(背景移动经历的时间,默认为speed)使用
1. 对于swiper-container的子元素,视差效果:背景随之移动
2、对于slides的子元素,视差效果:背景不动,文字移动
》setWrapperSize:true/false(默认)//开启这个设定会在Wrapper上添加等于slides相加的宽高,作用是兼容不支持flexbox布局的浏览器
》virtualTranslate:true/false(默认)//swiper除了不会移动外其他和平常都一样,设置后可以自己定义slide的 移动效果。启用这个选项时onSlideChange和onTransition事件失效。
》width(height):具体值//强制Swiper的宽度,当你的Swiper在隐藏状态下初始化时才用得上。这个参数会使自适应失效。其中width: window.innerWidth,height : window.innerHeight表设为全屏高宽
》roungLength:true/false(默认)//设定为true将slide的宽和高取整(四舍五入)以防止某些分辨率的屏幕上文字模糊。
》slideOffsetBefore(slideOffsetAfter):具体数字//设定slide与左边框(右边框)的预设偏移量(单位px)
进度属性
》watchSlideProgress:true/false(默认)//开启这个参数来计算每个slide的progress(进度),Swiper的progress无需设置即开启,一般与watchSlidesVisibility搭配使用
》watchSlideVisibility:true/false(默认)//如果开启了watchSlidesVisibility,则会在每个可见slide增加一个classname,默认为'swiper-slide-visible'。