swiper是一款使用javascript打造的特效插件，主要适用于手机端或者是网页滚动效果，使交互方式更加的人性化。本次为大家带来的swiper插件属于中文版，方便国内程序员使用，让您制作出来的页面或者是移动端特效更加的自然，希望可以帮助到大家。

swiper的使用方式也都比较简单，大家在开发的时候直接引入即可调用，省去了手动开发特效的麻烦，相信可以起到锦上添花的效果。

swiper特色介绍：

1、纯javascript打造的滑动特效插件；

2、适用于手机、平板电脑等移动终端；

3、能够实现触屏焦点图、触屏Tab切换等效果；

4、可以快速地做出一个轮播图，或者扩展使其做出复杂的轮播效果。

swiper使用方法：

1、首先加载插件，需要用到的文件有swiper.min.js和swiper.min.css文件。可下载Swiper文件或使用CDN。

2、HTML内容。

3、你可能想要给Swiper定义一个大小，当然不要也行。

4、初始化Swiper：最好是挨着标签

如果不能写在HTML内容的后面，则需要在页面加载完成后再初始化。

或者这样（Jquery和Zepto）(推荐)

5、完成。恭喜你，现在你的Swiper应该已经能正常切换了。

解决办法：

swiper插件会错位怎么办？

在swiper初始化内添加这两个属性就可以了；

observer:true,//修改swiper自己或子元素时，自动初始化swiper

observeParents:true,//修改swiper的父元素时，自动初始化swiper

swiper插件的图片自适应高度怎么设置？

自适应高度的实现，在自己的css中添加：

.swiper-slide{height:1px} /* 随意指定一个height值即可 */

.swiper-slide-active { height:auto}