$("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 ( Math.abs(X) > Math.abs(Y) && X > 0 ) {
      alert("left 2 right");
    }
    else if ( Math.abs(X) > Math.abs(Y) && X < 0 ) {
      alert("right 2 left");
    }
    else if ( Math.abs(Y) > Math.abs(X) && Y > 0) {
      alert("top 2 bottom");
    }
    else if ( Math.abs(Y) > Math.abs(X) && Y < 0 ) {
      alert("bottom 2 top");
    }
    else{
      alert("just touch");
    }
  });

js判断触摸方向的更多相关文章

  1. 移动端JS判断手势方向

    原生JS判断手势方向的解决思路: 1.滑动屏幕事件使用html5 的touchstart滑动开始事件和touchend滑动结束事件. 2.方向的判断,以起点做平面坐标系,与终点连线做直线,直线与x正半 ...

  2. 移动应用滑动屏幕方向判断解决方案,JS判断手势方向

    问题分类 滑动屏幕打开相应功能操作. 问题描述 1.用户手动滑动屏幕,根据滑动的方向,打开相应的功能(如:向上滑摇钱树经验明细,向下滑打开任务明细,向左滑打开聚宝盆物品查看等功能),滑动事件捕获问题. ...

  3. js判断滚动方向

     //页面滚动监听事件     window.onscroll = function (e) {                scrollFunc();         $("#t&quo ...

  4. Unity3D判断触摸方向

    据说 Temple Run(神庙逃亡) 就是用这种方式操作的 废话不多说 直接上代码 using UnityEngine; using System.Collections; public class ...

  5. 通过JS判断联网类型和连接状态

    通过JS判断联网类型和连接状态 中国的移动网络环境复杂,为了给用户带去更好访问体验,开发者希望能了解用户当前的联网方式,然后给用户一个符合当前网络环境的请求结果. W3C的规范中给出了一个方法来获得现 ...

  6. js判断手机的横竖屏调整样式

    在移动端,我们经常遇到横竖屏的问题,所以我们改如何判断或针对横竖屏来写代码呢.首先需要在head中加入如下代码: <meta name="viewport" content= ...

  7. JS 判断移动端与PC端

    js判断移动端与pc端   这里介绍下使用device.js插件来判断移动端设备 地址:https://github.com/matthewhudson/device.js 示例: 1 2 3 4 5 ...

  8. js判断本机是否已安装app

    需求:在浏览器或者app webview中打开的页面,js判断本机是否已安装搜狐新闻客户端. 一.微信 1.分享——好友/朋友圈,feed会有搜狐新闻标记,打开url后缀参数isappinstalle ...

  9. js判断网页是否加载完毕 包括图片

    <script type="text/javascript" language="JavaScript"> //: 判断网页是否加载完成 docum ...

随机推荐

  1. Arduino I2C + 数字式环境光传感器BH1750FVI

    BH1750FVI是日本罗姆(ROHM)半导体生产的数字式环境光传感IC.其主要特性有: I2C数字接口,支持速率最大400Kbps 输出量为光照度(Illuminance) 测量范围1~65535 ...

  2. 微软和Google的盈利模式对比分析

    一: 微软和Google是世界上最成功科技巨头之一,但他们之间却有着不同的产品和业务,二者的盈利方式也各有不同,本文将分析和探讨的二者盈利模式的异同. 微软的盈利模式 在1975年由大学肄业的Bill ...

  3. layui之弹出层--从父窗口传递数据到子窗口

    原文链接:https://blog.csdn.net/Code_shadow/article/details/80524633 var Index = layer.open({ title: &quo ...

  4. 基于zookeeper实现高性能分布式锁

    实现原理:利用zookeeper的持久性节点和Watcher机制 具体步骤: 1.创建持久性节点 zkLock 2.在此父节点下创建子节点列表,name按顺序定义 3.Java程序获取该节点下的所有顺 ...

  5. pch文件配置出现 Expected unqualified-id 和 Unkown type name 'NSString'

    1.发生的现象 之前代码还是没有报错的,由于某些代码比较常用,就打算配置一个pch文件引入常用的文件 但是引入的时候就出现了报错 2.原因与解决办法 2.1 原因 你引入的文件可能使用到OC与C++混 ...

  6. c++实验2 顺序存储线性表

    线性表顺序存储 实现了动态数组的增删改查  前驱后继  A=AUB 动态数组右移 (1)顺序表存储结构的定义(类的声明): class SeqList { protected: DataType *l ...

  7. 使用itchat监控微信消息,从此不再为撤回烦恼

    强大的Itchat itchat是一个开源的微信个人号接口,使用python封装接入微信网页版接口,通过调用itchat来登录微信网页版收发消息. 项目简介 - itchat 掌握itchat之后,只 ...

  8. asp手动给combox赋值

    ASPxComboBox cbSex = ASPxGridView1.FindEditFormTemplateControl("cmbUSER_SEX") as ASPxCombo ...

  9. cenos安装memcache

    注意事项: 1 安装时注意权限问题 sudo 2 需先启动memcache服务 php才能测试   Memcached是高性能的,分布式的内存对象缓存系统,用于在动态应用中减少数据库负载,提升访问速度 ...

  10. 用shell脚本安装apache

    我们首先创建一个文件为test.sh,执行此文件的方法有以下四种方式: 1../test.sh(必须chmod赋予执行权限) 2.. test.sh 3.sourse test.sh 4.[shell ...