$("body").on("touchstart", function(e) {

    e.preventDefault();

    startX = e.originalEvent.changedTouches[0].pageX,

    startY = e.originalEvent.changedTouches[0].pageY;

});

$("body").on("touchmove", function(e) {

    e.preventDefault();

    moveEndX = e.originalEvent.changedTouches[0].pageX,

    moveEndY = e.originalEvent.changedTouches[0].pageY,

    X = moveEndX - startX,

    Y = moveEndY - startY;

    if
( X > 0 ) {

        alert("left 2 right");

    }

    else
if  ( X < 0 ) {

        alert("right 2 left");

    }

    else
if  ( Y > 0) {

        alert("top 2 bottom");

    }

    else
if  ( Y < 0 ) {

        alert("bottom 2 top");

    }

    else{

        alert("just touch");

    }

});

touch事件总结的更多相关文章

  1. UC浏览器中touch事件的异常记录

    以前也在UC上面栽过几个坑,不过都是页面显示方面的.上个周的时候,商品详情页重做,要添加个上拉显示详情的效果. 有两个条件需要判断: 1.是否到达底部: 2.到达底部之后拖动的y轴距离. 效果写完后, ...

  2. 移动端开发概览【webview和touch事件】

    作为一个前端,而且作为一个做移动端开发的前端,那意味着你要有三头六臂,跟iOS开发哥哥一起打酱油,跟Android开发哥哥一起修bug... Android vs Ios 我在webkit内核的chr ...

  3. 手持设备点击响应速度,鼠标事件与touch事件的那些事

    前言 现在一直在做移动端的开发,这次将单页应用的网页内嵌入了app,于是老大反映了一个问题:app应用点击响应慢!我开始不以为然,于是拿着网页版的试了试,好像确实有一定延迟,于是开始了研究,最后选择了 ...

  4. 第六课 touch事件

    1.移动端页面在PC上浏览时,限制宽度的方法: 2.移动端页面切换设备时自动刷新页面的方法: 3.touch事件 touchstart:当手指触摸屏幕时触发.通过addEventListener添加移 ...

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

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

  6. js的touch事件的实际引用

    一开始做前端页面的时候,接触的也是js,但是随后便被简单高效的jquery吸引过去,并一直使用至今. 而js,则被我主观的认为底层技术而抛弃. 直到这几天工作需要,研究移动端页面的触屏滑动事件,搜索j ...

  7. H5中的touch事件

    touch中共有touchstart.touchmove和touchend三个事件: touchstart:触摸开始的时候触发 touchmove:手指在屏幕上滑动的时候触发 touchend:触摸结 ...

  8. javascript移动设备Web开发中对touch事件的封装实例

    在触屏设备上,一些比较基础的手势都需要通过对 touch 事件进行二次封装才能实现.zepto 是移动端上使用率比较高的一个类库,但是其 touch 模块模拟出来的一些事件存在一些兼容性问题,如 ta ...

  9. Android Touch事件传递机制 二:单纯的(伪生命周期)

    转载于:http://blog.csdn.net/yuanzeyao/article/details/38025165 在前一篇文章中,我主要讲解了Android源码中的Touch事件的传递过程,现在 ...

  10. Android Touch事件传递机制 一: OnTouch,OnItemClick(监听器),dispatchTouchEvent(伪生命周期)

      ViewGroup View  Activity dispatchTouchEvent 有 有 有 onInterceptTouchEvent 有 无 无 onTouchEvent 有 有 有 例 ...

随机推荐

  1. Entity Framework Code-First(10.1):EntityTypeConfiguration

    EntityTypeConfiguration Class in Code-First: Before we start to configure using Fluent API, let's se ...

  2. 以后尽量不用cin、cout啦

    cout输出有问题(对于double,不同OJ处理的结果不一样),cin读入机制较scanf繁琐.慢!!!!!!!!

  3. 网页编程技术与实例 PDF扫描版

    本书主要包括:Web的概念,使用网页编辑工具制作网页,HTML语言的基本结构,JavaScrip和VBScript脚本语言的编程方法,ASP的概念,ASP对象的属性.方法和事件,SQL语言,数据库建议 ...

  4. 微信小程地图片未加载成功的情况 Failed to load local image resource

    在开发小程序的时候,发现在加载图片时并没有异常,但是后台却报错了. 例如以下我的一段代码: <view class="useage2 "> <image src= ...

  5. cinder 服务启动与请求流程源码分析

    文章以ocata版本进行分析 cinder   api 的创建和启动,和 nova   api 类似,都是通过在 api-paste.ini 中定义 app ,然后将 app 加载之后,启动 wsgi ...

  6. One-Hot独热编码

    One-Hot独热编码 Dummy Encoding VS One-Hot Encoding二者都可以对Categorical Variable做处理,定性特征转换为定量特征,转换为定量特征其实就是将 ...

  7. php文件上传(视频图片或者其他)

    html页面 <html> <head> <meta charset="utf-8"> <title></title> ...

  8. KONG -- 配置 service 并添加 key-auth

    默认情况下, KONG 监听下面几个端口: 8000   这个端口用于监听客户端的 HTTP 请求,并转发给上游服务 8443   这个端口用于监听客户端的 HTTPS 请求,并转发给上游服务 800 ...

  9. MCP|DYM|Quantitative mass spectrometry to interrogate proteomic heterogeneity in metastatic lung adenocarcinoma and validate a novel somatic mutation CDK12-G879V (利用定量质谱探究转移性肺腺瘤的蛋白质组异质性及验证新体细胞突变)

    文献名:Quantitative mass spectrometry to interrogate proteomic heterogeneity in metastatic lung adenoca ...

  10. 「模拟赛20180306」回忆树 memory LCA+KMP+AC自动机+树状数组

    题目描述 回忆树是一棵树,树边上有小写字母. 一次回忆是这样的:你想起过往,触及心底--唔,不对,我们要说题目. 这题中我们认为回忆是这样的:给定 \(2\) 个点 \(u,v\) (\(u\) 可能 ...