Swiper 免费轻量级移动设备触摸滑块js框架

无需加好友免费技术支持

今天和大家分享一个网站Swiper中文网，在开发网页的过程中，我基本上直接用它的插件，非常好用！

关于Swiper

Swiper 免费轻量级移动设备触摸滑块js框架，使用硬件加速过渡(如果设备支持)。主要用于移动网站和移动网站web apps，native apps和hybrid apps。主要是为IOS而设计，同时，在Android、WP8系统也有很好的用户体验，Swiper从3.0不再全面支持PC端。因此，如需在PC可以选择与更多浏览器兼容的浏览器Swiper2.x（甚至支持IE7）。

目前，使用了许多优秀的网站Swiper

可直接访问官网地址：

Swiper优点

Swiper是纯javascript为手机、平板电脑等移动终端创建滑动特效插件

Swiper触摸屏焦点图可以实现Tab常见的效果如切换、触摸屏多图切换等

Swiper开源、免费、稳定、使用简单、功能强大，是移动终端网站架构的重要选择

Swiper移动终端网站内容常用于触摸滑动

Swiper拥有灵活的progress，这是自定义制作3D切换效果的利器

Swiper制作3D切换效果的方法有很多种。cube、coverflow和flip可轻松实现3D如果您想制作其他新颖的切换方法，建议使用过渡progress。

progress它可以帮助你获得滑块的进度索引。

例如：watchSlidesProgress

打开这个参数来计算每个参数slide的progress(进度、进程)，Swiper的progress无需设置即开启。

对于slide的progress属性，活动的为0，其他的依次减1。例如，如果共有6个slide，第三个活动，从第一个到第六个progress属性分别为：2、1、0、-1、-2、-3。

对于swiper的progress属性，活动slide最左(上)边时为0，活动slide在最右边(下)边为1，其他情况平分。例子:有6个slide，第三次活动swiper的progress属性是0.4.第五次活动时swiper的progress属性是0.8。

swiper的progress其实就是wrapper的translate值的百分值，和activeIndex等属性不同，progress是随着swiper而不是在某个时间点突变。

watchSlidesProgress参数

类型：

boolean

默认：

false

举例：

true

启用版本：

4.0.0

更多功能，可直接访问官网：Swiper中文网

Swiper 4 的特色功能

不依赖框架：

Swiper无需加载任何公共库(如jquery）可以运行，这是有保证的Swiper轻量和运行速度。Swiper也可以在加载公共仓库的环境中安全运行，如jQuery, Zepto, jQuery Mobile等

1:1的触摸滑动：

Swiper默认触摸比为1:1，可修改Swiper改变这个比例的设置。

监视器：

Swiper监视器可以通过设置打开，具有此功能Swiper你可以动态改变Dom或Swiper样式自动重新初始化并计算所需元素。

丰富的API：

Swiper 拥有丰富的API，允许您建立自己独特的分页器、导航、视差滚动或其他精彩的效果

多行slides布局：

Swiper允许多行Slides布局，这样每行的slide就会较少。

过渡效果：

增加了三种新的过渡效果过渡效果D方块、3D流。

Flexbox网格：

你可以在Swiper设置初始化时slide包括每行、每列、每组数量和间距。