js书写移动端常用事件

移动端的事件是新增的，叫“touch”事件 触摸事件。

click点击事件依然支持，会有300ms的延迟

touchstart, tap, click的加载快慢顺序

touchstart > tap > click

开始触摸 ：touchstart

触摸移动：touchmove

触摸结束：touchend

事件对象

获取手指按下的位置

在touchstart 和 touchmove 中：

e . touches[0].clientX

在touchend中：

e . changedTouches[0].clientX

当一个元素过渡完成之后会触发”transitionend“事件

注意：只有过渡结束事件，没有过渡开始事件

当一个元素动画开始的时候，会触发”animationstart“事件

当一个元素动画结束的时候，会触发”animationend”事件

书写移动端通常使用Zepto库

Zepto是一个轻量级的针对现代高级浏览器的JS库，它与jQuery有着类似的api

zepto是分模块的，使用什么模块都需要下载，很方便

Zepto的touch模块中的一些常用自定义移动端事件

swipe: 滑动

swipeLeft：左滑动

swipeRight：右滑动

swipeUp：上滑动

swipeDown：下滑动

tap：触碰

doubleTap：触碰两次

singleTap：触碰一次

longTap：长按（750ms之后执行）

客户端需要书写的meta标签 约束视口

<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0,user-scalable=no" id="viewport" />