屏幕事件监听

标签：

 1 oLl.addEventListener("touchstart",oLlScroll,false);
 2 
 3     function oLlScroll(ev) {
 4         var touch = ev.touches[0],   //第一次触摸点
 5         startY = touch.clientY,
 6         speedY = 0,
 7         maxTop = oLl.offsetHeight - oLl.parentNode.offsetHeight,
 8         percent = 0;
 9 
10         oLl.addEventListener("touchmove",oLlMove,false);
11         oLl.addEventListener("touchend",oLlEnd,false);

• touchstart:当手指触摸屏幕时触发；即使已经有一个手指放在了屏幕上也会触发。
• touchmove:当手指在屏幕上滑动时连续的触发。在这个事件发生期间，调用preventDefault()可阻止滚动。
• touchend:当手指从屏幕上移开时触发。
• touchcancel:当系统停止跟踪触摸时触发。关于此事件的确切触发事件，文档中没有明确说明。

上面这几个事件都会冒泡，也都可以取消。虽然这些触摸事件没有在DOM规范中定义，但它们却是以兼容DOM的方式实现的。因此，每个触摸事件没有在 DOM规范中定义，但它们却是以兼容DOM的方式实现的。因此，每个触摸事件的event对象都提供了在鼠标事件中常见的属性:bubbles、 cancelable、view、clientX、clientY、screenX、screenY、detail、altKey、shiftKey、 ctrlKey和metaKey。

除了常见的DOM属性外，触摸事件还包含下列三个用于跟踪触摸的属性。

• touches:表示当前跟踪的触摸操作的Touch对象的数组。
• targetTouches:特定于事件目标的Touch对象的数组。
• changeTouches:表示自上次触摸以来发生了什么改变的Touch对象的数组。

每个Touch对象包含下列属性。

• clientX:触摸目标在视口中的X坐标。
• clientY:触摸目标在视口中的Y坐标。
• identifier：表示触摸的唯一ID。
• pageX：触摸目标在页面中的x坐标。
• pageY：触摸目标在页面中的y坐标。
• screenX:触摸目标在屏幕中的x坐标。
• screenY:触摸目标在屏幕中的y坐标。
• target:触摸的DOM节点坐标。

screenX:鼠标位置相对于用户屏幕水平偏移量，而screenY也就是垂直方向的，此时的参照点也就是原点是屏幕的左上角。

clientX:跟screenX相比就是将参照点改成了浏览器内容区域的左上角，该参照点会随之滚动条的移动而移动。

pageX：参照点也是浏览器内容区域的左上角，但它不会随着滚动条而变动

屏幕事件监听

标签：

原文地址：http://www.cnblogs.com/cyanqq/p/4621045.html