目有个交互需要实现手指滑动的交互，pc端使用mousedown,mousemove,mouseup监听实现。

但在ios设备上mousemove是不好监听的，同类的方法是touchstart,touchmove,touchend。

如何获取手指滑动时的坐标位置呢?

直接使用event.clientX是不起作用的，要使用event.changedTouches[0].clientX才好,

如果是jquery的event对象，使用event.originalEvent.changedTouches[0].clientX。

移动端touch事件获取clientX, clientY的更多相关文章

  1. H5案例分享：移动端touch事件判断滑屏手势的方向

    移动端touch事件判断滑屏手势的方向 方法一 当开始一个touchstart事件的时候,获取此刻手指的横坐标startX和纵坐标startY: 当触发touchmove事件时,在获取此时手指的横坐标 ...

  2. 移动端Touch事件基础

    1.三个常用的移动端事件 ontouchstart 手指按下时触发 ontouchmove 手指移动时触发 ontouchend 手动抬起时触发 注意:这些事件当作事件属性使用时,不兼容谷歌浏览器. ...

  3. 移动端Touch事件

    案例1: <!doctype html> <html lang="en"> <head> <meta charset="UTF- ...

  4. 移动端 Touch 事件

    在移动端页面开发时,常常会用到touch事件,比如左滑右滑的轮播等.常用的触摸事件有touchstart,touchmove,touchend. 每个事件包含下面三个用于跟踪虎摸的属性: touche ...

  5. 原生js移动端touch事件实现上拉加载更多

    大家都知道jQuery里没有touch事件,所以在移动端使用原生js实现上拉加载效果还是很不错的,闲话不多说,代码如下: //获取要操作的元素 var objSection = document.ge ...

  6. 移动端 touch 事件的originalEvent

    对于移动端的触摸事件,我们通过touchstart.touchmove.touchend实现,PC端一般使用mousedown.mousemove.mouseup实现. 我们获取事件坐标,原生js获取 ...

  7. 移动端touch事件封装

    <meta charset="utf-8"><meta name="viewport" content="width=device- ...

  8. 移动端touch事件 || 上拉加载更多

    前言: 说多了都是泪,在进行项目开发时,在上拉加载更多实现分页效果的问题上,由于当时开发任务紧急,所以就百度找了各种移动端的上拉下拉 实现加载更多的插件.然后就留下了个坑:上拉加载的时候会由于用户错误 ...

  9. 移动端touch事件影响click事件以及在touchmove添加preventDefault导致页面无法滚动的解决方法

    这两天自己在写一个手机网页,用到了触屏滑动的特效,就是往右滑动的时候左侧隐藏的菜单从左边划出来. 做完之后在手机原生浏览器中运行正常,但在QQ和微信中打开,发现touchmove只会触发一次,而且to ...

随机推荐

  1. MySql 如何实现不同数据库同步【2个】

    环境要求: Windows 操作系统 需要Mysql 3.23.15以后的版本. 假设数据库A为主机,数据库B为从机(A向B提供同步服务,即B中的数据来自A) A机器:IP=10.10.151.166 ...

  2. Highcharts属性介绍

    <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/ ...

  3. OSI参考模型初识

    纪念我曾今热爱的数通(^o^). 1.osi参考模型 2.数据的封装和解封装 3.主机和主机间通信

  4. 导入导出Mysql数据库、表结构、表数据

    由sql文件导入 mysql -uusername -ppwd < ./abc.sql 导出整个数据库的表结构 mysqldump -uroot -pdbpasswd -d dbname > ...

  5. 【卷二】网络二—TCP服务器与客户端

    经过上回简单地介绍,大家对服务器多少应该清楚一些了吧!还记得TCP: (Transmission Control Protocol) 传输控制协议? 还记得IP: (Internet Protocol ...

  6. ios GCD的使用及封装

    实现代码: CGDHelper /* * Grand Central Dispatch (GCD)是Apple开发的一个多核编程的解决方法. * 系统要求:iOS4.0以上. */ #import & ...

  7. kindeditor编辑器上传图片失败 错误 405.0解决办法（亲测）

    HTTP 错误 405.0 - Method Not Allowed(省略)editor/php/upload_json.php?dir=image物理路径 http://www.gdgoga.com ...

  8. php和node高并发 大数据量怎么处理

    有的时候可能因为疏忽忘记注册Service直接就使用了,使用那个Service时会报异常.这种情况项目都是可以编译通过的,是一个不太容易发现的BUG,如果那个Service在测试时没有覆盖到这个BUG ...

  9. 移动互联网app

    移动互联网app 2 App测试点 2.1安全测试 2.1.1软件权限 1隐私泄露风险:包括访问手机信息.访问联系人信息等 2对App的输入有效性校验.认证.授权.敏感数据存储.数据加密等方面进行检测 ...

  10. 。net定时关闭excel进程

    public void Application_Start() { // 在应用程序启动时运行的代码 System.Timers.Timer timer = new System.Timers.Tim ...