手机触摸屏的JS事件

来源：互联网发布：cpa源码编辑：程序博客网时间：2024/05/01 03:44

处理Touch事件能让你跟踪用户的每一根手指的位置。你可以绑定以下四种Touch事件：

?
1
2
3
4
touchstart:  // 手指放到屏幕上的时候触发 
touchmove:  // 手指在屏幕上移动的时候触发
touchend:  // 手指从屏幕上拿起的时候触发
touchcancel:  // 系统取消touch事件的时候触发。至于系统什么时候会取消，不详

在开始描述touch事件之前，需要先描述一下多触式系统中特有的touch对象（android和iOS乃至nokia最新的meego系统都模拟了类似的对象，这里只针对iOS，因为我只有iPad可用于测试。。）。这个对象封装一次屏幕触摸，一般来自于手指。它在touch事件触发的时候产生，可以通过touch event handler的event对象取到（一般是通过event.changedTouches属性）。这个对象包括一些重要的属性：

?
1
2
3
4
client / clientY：// 触摸点相对于浏览器窗口viewport的位置
pageX / pageY：// 触摸点相对于页面的位置
screenX /screenY：// 触摸点相对于屏幕的位置
identifier： // touch对象的unique ID

HTML主体定义

<body style=”height: 100%;margin:0;padding:0”>
<div id=”canvas”  style=”position: relative;width:100%;height: 100%;”></div>
</body>

0 0