[JavaScript知识库]jQuery（十三）移动端js事件和swiper库

移动端js事件

移动端的操作方式和PC端是不同的的，移动端主要是用手指操作，所以有特殊的touch事件，touch事件包括如下几个事件：

1. touchstart: //手指放到屏幕上时触发
2. touchmove: //手指放到屏幕上滑动时触发
3. touchhend: //手指离开屏幕时触发
4. touchcancel: //系统取消touch事件的时候触发，比较少用

移动端一般有三种操作，点击、滑动、拖动，这三个操作一般是组合使用上面的几个事件来完成的，所有上面的4个事件一般很少单独使用，一般是封装使用来实现这三种操作，可以使用封装成熟的js库。

zeptojs

Zepto是一个轻量级的针对现代高级浏览器的javascript库，它与jQuery有着类似的api。如果你会用jquery，那么你也会用zepto。zepto的一些可选功能是专门针对移动端浏览器的；他的最初目标实在移动端提供一个精简类似jQuery的js库。（现在不怎么用了，因为现在手机性能越来越好，可以支持较大的jQuery库了。）

swiper

swiper.js是一款成熟稳定的应用与PC端和移动端的滑动效果插件，一般用来触屏焦点图，触屏整屏滚动等效果。swiper分为2.x版本和3.x版本，2.x版本支持低版本的浏览器（IE7），3.x放弃支持低版本浏览器，适合应用在移动端。

• swiper使用方法：
  如果页面应用了jQuery或者zepto，就引用swiper.jquery.min.js,他的容量比swiper.min.js小，话要引用swiper.min.css,在主页面样式之前引用。更多的使用方法，可以查看中文官网http://www.swiper.com.cn/

• swiper常用参数：

1. initialSlide:初始索引值，从0开始
2. direction: 滑动方向horizontal | vertical
3. speed:滑动速度，单位ms
4. autoplay：设置自动播放及播放时间
5. autoplayDsableOnlnteraction: 用户操作swiper后是否还自动播放，默认是true,不再自动播放为false
6. pagination：分页圆点
7. paginationClickable：分页圆点是否点击
8. prevButton：上一页箭头
9. nextButton：下一页箭头
10. loop：是否首位衔接