挪动端手势
1. 什么是挪动端手势事件(touch):在手机或平板上手指与屏幕接触产生交互的事件。
2. touch 有哪些事件
1.touchstart:当手指触摸屏幕时触发如何应用
el.addEventListener('touchstart',function(event){...},false)
2.touchmove:当手指在屏幕滑动时一直的触发
如何应用
el.addEventListener('touchmove',function(event){...},false)
3.touchend:当手指从屏幕上移开时触发
如何应用
el.addEventListener('touchend',function(event){...},false)
4.touchcancel:当零碎进行跟踪触摸时触发(意外进行触摸,如忽然来了电话)
如何应用
el.addEventListener('touchcancel',function(event){...},false)
5. 毛病每个元素都要增加事件繁琐
6. 优化:
document.addEventListener('touch***',function(event){//event 以后手指触摸的元素。若又其余需要也能够增加判断 判断 e.target 属性},false)
3.touchEvent 事件对象
- touches:以后屏幕上所有的手指对象
- targetTouches:以后元素上的手指对象 (举荐应用)
- changedTouches:以后屏幕上变动的手指对象(屏幕触摸的手指从无到有,或从有到无,只会返回点击或来到的手指)
-
event(挪动端个别应用 client)
- clientx:绝对于以后视口 以后手指的地位间隔视口的左上角 X 的值
- clienty:绝对于以后视口 以后手指的地位间隔视口的左上角 Y 的值
- screenX: 以后手指的地位间隔屏幕的左上角 X 的值
- screenY:以后手指的地位间隔屏幕的左上角 Y 的值
- pageX: 绝对于以后页面的内容 以后手指的地位间隔以后内容的左上角 X 的值
- pageY: 绝对于以后页面的内容 以后手指的地位间隔以后内容的左上角 Y 的值