阿里巴巴怎样做网站,怎么建网页,外贸获客软件排名前十名,手机营销型网站制作目有个交互需要实现手指滑动的交互#xff0c;pc端使用mousedown,mousemove,mouseup监听实现。 但在ios设备上mousemove是不好监听的#xff0c;同类的方法是touchstart,touchmove,touchend。 项目需求#xff0c;需要用到拖动事件。由于不需要考虑IE8等低端浏览器的兼容性pc端使用mousedown,mousemove,mouseup监听实现。 但在ios设备上mousemove是不好监听的同类的方法是touchstart,touchmove,touchend。 项目需求需要用到拖动事件。由于不需要考虑IE8等低端浏览器的兼容性 所以想到HTML5中的drag事件 发现移动端 android IOS 并不支持 drag 事件。现在让我们来介绍一下移动端的常用事件吧 一、click点击事件 单击事件类似于PC端的click但在移动端中连续click的触发有200ms ~ 300ms的延迟。 二、touch触摸事件 触摸事件有touchstart touchmove touchend touchcancel 四种之分常用的有 touchstart手指触摸到屏幕会触发 touchmove当手指在屏幕上移动时会触发 touchend当手指离开屏幕时会触发 touchcancel可由系统进行的触发不常用事件比如手指触摸屏幕的时候突然alert了一下或者系统中其他打断了touch的行为则可以触发该事件。 2.1事件列表 上面的三个触摸事件每个事件都有以下列表 changedTouches保存了所有引发事件的手指信息 targetTouches保存了当前对象上所有触摸点的列表; touches保存了当前所有触碰屏幕的手指信息 2.1.1事件属性(只读属性) 每个事件有列表每个事件列表还有以下属性 pageX //相对于页面的 X 坐标,与 clientX 不同的是他包括左边滚动的距离如果有的话。 pageY //相对于页面的 Y 坐标,与 clientY 不同的是他包括上边滚动的距离如果有的话。 clientX //相对于视区的 X 坐标 clientY //相对于视区的 Y 坐标 screenX //相对于屏幕的 X 坐标 screenY //相对于屏幕的 Y 坐标 identifier // 当前触摸点的惟一编号 target //手指所触摸的 DOM 元素 Touch.radiusX //能够包围用户和触摸平面的接触面的最小椭圆的水平轴(X轴)半径。这个值的单位和 screenX 相同。只读属性。 Touch.radiusY //能够包围用户和触摸平面的接触面的最小椭圆的垂直轴(Y轴)半径。这个值的单位和 screenY 相同。只读属性。 Touch.rotationAngle //它是这样一个角度值由radiusX 和 radiusY描述的正方向的椭圆需要通过顺时针旋转这个角度值才能最精确地覆盖住用户和触摸平面的接触面。只读属性。 Touch.force //手指挤压触摸平面的压力大小从0.0(没有压力)到1.0(最大压力)的浮点数。只读属性。 比如想获取手指拖动滑动的坐标位置直接使用event.clientX是不起作用的要使用event.changedTouches[0].clientX才好, 如果是jquery的event对象使用event.originalEvent.changedTouches[0].clientX。 调用事件方法1jquery方法$(document).bind(touchend, function(e){}2javascript方法document.addEventListener(touchend,function(e){}); 三、tap类触碰事件 触碰事件我目前还不知道它和touch的区别一般用于代替click事件有tap longTap singleTap doubleTap四种之分有时会用tap代替click事件 tap: 手指碰一下屏幕会触发 longTap: 手指长按屏幕会触发 singleTap: 手指碰一下屏幕会触发 doubleTap: 手指双击屏幕会触发 四、swipe滑动事件 滑动事件有swipe swipeLeft swipeRight swipeUp swipeDown 五种之分 swipe手指在屏幕上滑动时会触发 swipeLeft手指在屏幕上向左滑动时会触发 swipeRight手指在屏幕上向右滑动时会触发 swipeUp手指在屏幕上向上滑动时会触发 swipeDown手指在屏幕上向下滑动时会触发 五、gesture手势事件 当两个手指触摸屏幕时就会产生手势手势通常会改变显示项的大小或者旋转显示项。有三个手势事件分别如下。 gesturestart:当一个手指已经按在屏幕上面另一个手指有触摸屏幕时触发。gesturechange:当触摸屏幕的任何一个手指的位置发生变化时触发。gestureend:当任何一个手指从屏幕上面移开时触发。 转载于:https://www.cnblogs.com/jing-tian/p/11049705.html
