Touch Event

转自: http://hi.baidu.com/masaiui/item/971775e8b316238bc10d754b

参考:　http://hedgehogking.com/?p=556

最近在开发手机端WEB2.0网站。转载一个留着备用

touchstart：触摸开始的时候触发

touchmove：手指在屏幕上滑动的时候触发

touchend：触摸结束的时候触发

而每个触摸事件都包括了三个触摸列表，每个列表里包含了对应的一系列触摸点（用来实现多点触控）：

touches：当前位于屏幕上的所有手指的列表。

targetTouches：位于当前DOM元素上手指的列表。

changedTouches：涉及当前事件手指的列表。

每个触摸点由包含了如下触摸信息（常用）：

identifier：一个数值，唯一标识触摸会话（touch session）中的当前手指。一般为从0开始的流水号（android4.1，uc）

target：DOM元素，是动作所针对的目标。

pageX/pageX/clientX/clientY/screenX/screenY：一个数值，动作在屏幕上发生的位置（page包含滚动距离,client不包含滚动距离，screen则以屏幕为基准）。　

radiusX/radiusY/rotationAngle：画出大约相当于手指形状的椭圆形，分别为椭圆形的两个半径和旋转角度。初步测试浏览器不支持，好在功能不常用，欢迎大家反馈。

/*单指拖动*/
var obj = document.getElementById('id');
obj.addEventListener('touchmove', function(event) {// 如果这个元素的位置内只有一个手指的话if (event.targetTouches.length == 1) {event.preventDefault();// 阻止浏览器默认事件，重要 var touch = event.targetTouches[0];// 把元素放在手指所在的位置obj.style.left = touch.pageX-50 + 'px';obj.style.top = touch.pageY-50 + 'px';}
}, false);

转载于:https://www.cnblogs.com/BigIdiot/p/3170093.html

Touch Event相关推荐

Ended a touch event which was not counted in trackedTouchCount （ReactNative RN开发时多点触摸滑动报错）
在进行React Native开发app时,如果在 ReactActivity 的子类所在页面,多个(三个以上)手指同时滑动时,会报出以下错误: "Ended a touch event w ...
support mobile touch event
If extra event support is needed, jQuery mobile event plugin is loaded to support tap, swipe and scr ...
自定义ViewGroup (3) 与子View之间 Touch Event的拦截与处理
2019独角兽企业重金招聘Python工程师标准>>> 在昨天的博客(自定义ViewGroup(2))中,我们解决了多个手指交替滑动带来的页面的跳动问题.但同时也还遗留了两个问题. ...
js实现手机端滑动事件 touch event
①touchstart是点击触发 ②touchmove是监听触摸轨迹,会反复触发多次 ③touchend则是触摸结束时触发在做图片滚动时,需要计算滑动距离而非滑动轨迹因此只利用①+③即可 let ...
mass Framework event模块 v4
event.js //========================================== // 事件模块(包括伪事件对象,事件绑定与事件代理) //================= ...
Android Touch事件传递机制解析 (推荐)
最近新闻列表里的下拉 down up move 等等让我十分头疼 ,无意间看到了一篇非常不错的帖子,转载如下: 开篇语:最近程序在做一个小效果,要用到touch,结果整得云里面雾里的,干脆就好好把a ...
mass Framework event模块 v8
最近对事件模块进行疯狂升级的成果. define("event", top.dispatchEvent ? ["$node"] : ["$node&q ...
源码阅读分析 View的Touch事件分发
其实 Android 事件分发机制在早几年一直都困扰着我,那时候处理事件分发的自定义 View 脑子都是一片白,老感觉处理不好.后来自己看了 android 源码,也阅读了很多大牛的文章才算彻底明白, ...
Android中的Touch事件
Android中的Touch事件处理主要内容 Activity或View类的onTouchEvent()回调函数会接收到touch事件. 一个完整的手势是从ACTION_DOWN开始,到ACTION ...

Touch Event

Touch Event相关推荐

最新文章

热门文章