js代码

$(function() {

    function judge() {

        var startx;//让startx在touch事件函数里是全局性变量。

        var endx;

        var el = document.getElementById('io');//触摸区域。

        function cons() {   //独立封装这个事件可以保证执行顺序，从而能够访问得到应该访问的数据。

            if (startx > endx) {  //判断左右移动程序

                alert("left");

            } else {

                alert("right");

            }

        }  

        el.addEventListener('touchstart', function (e) {

            var touch = e.changedTouches;

            startx = touch[].clientX;

            starty = touch[].clientY;

        });

        el.addEventListener('touchend', function (e) {

            var touch = e.changedTouches;

            endx = touch[].clientX;

            endy = touch[].clientY;

            cons();  //startx endx 的数据收集应该放在touchend事件后执行，而不是放在touchstart事件里执行，这样才能访问到touchstart和touchend这2个事件产生的startx和endx数据。另外startx和endx在_touch事件函数里是全局性的，所以在此函数中都可以访问得到，所以只需要注意事件执行的先后顺序即可。

        });

    }  

    judge();

})

html随便写就可以  记得id要对应

<body>

    <div style="width: 100%;height: 3000px;background: #08c;" id="io">  

    </div>

</body>

　　

js判断手机的左右滑动的更多相关文章

  1. js判断手机 横屏模式

    js判断手机 横屏模式 方法名称:orientation 实例: if(window.orientation!=0){ var obj=document.getElementById('orienta ...

  2. js判断手机浏览器操作系统和微信浏览器的方法

    做手机端的前端开发,少不了对手机平台的判断.如,对于app下载,就要判断在Android平台下就显示Android下载提示:在iOS平台下就显示iOS下载提示. 今天就为大家介绍一下用js判断手机客户 ...

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

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

  4. js判断手机浏览器是横屏or竖屏

    移动端的浏览器一般都支持window.orientation这个参数,通过这个参数可以判断出手机是处在横屏还是竖屏状态. 从而根据实际需求而执行相应的程序.通过添加监听事件onorientationc ...

  5. js判断手机系统和微信

    //判断手机浏览器 var ua = navigator.userAgent; var ipad = ua.match(/(iPad).*OS\s([\d_]+)/), isIphone = !ipa ...

  6. js判断手机是否安装了某一款app，有则打开，没有去下载

    function openApp(){ if(navigator.userAgent.match(/(iPhone|iPod|iPad);?/i)) { var loadDateTime = new ...

  7. JS判断手机横竖屏

    在移动端开发时,有时候需要判断手机的横竖屏,那么就需要用到window.orientation这个参数,通过这个参数可以判断出手机是处在横屏还是竖屏状态. 屏幕方向对应的window.orientat ...

  8. 【转】js判断手机访问网页

    原理:原理有两个,第一:通过游览器(browser)判断是否是手机:第二:通过访问终端判断是否是手机(userAgent):但是通常考虑到兼容性,需要这两种原理同时使用:具体的实现如下: JS实现: ...

  9. JS判断手机访问跳转到手机站

    这里提供了六种让手机端访问网站跳转到手机端的方法: 第一种: <script> if(navigator.platform.indexOf('Win32')!=-1){ //pc //wi ...

随机推荐

  1. 四、Linux 忘记密码解决方法

    Linux 忘记密码解决方法 很多朋友经常会忘记Linux系统的root密码,linux系统忘记root密码的情况该怎么办呢?重新安装系统吗?当然不用!进入单用户模式更改一下root密码即可. 步骤如 ...

  2. PHP实现的敏感词过滤方法

    PHP实现的敏感词过滤方法,以下是一份过滤敏感词的编码.有需要可以参考参考. /** * @todo 敏感词过滤,返回结果 * @param array $list 定义敏感词一维数组 * @para ...

  3. 排序算法合集（Java）

    整理了一下常用的排序算法,算法过程和示意图不详细讲,百度很多,只列代码,如有错误,还望大家指出. 1.冒泡排序 public static void bubbleSort(int[] a){ for( ...

  4. POJ：2492-Bug's Life（二分图的判定）

    Bug's Life Time Limit: 10000MS Memory Limit: 65536K Description Background Professor Hopper is resea ...

  5. 动态规划（入门，滚动数组，记录的都是状态）：SWUSTACM-1010 魔兽争霸之最后的反击

    题目: 1010: 魔兽争霸之最后的反击                                                                         Time Li ...

  6. HDU 2087 HDU 1867 KMP标准模板题

    贴两道题,其中HDU2087是中文题,故不解释题目, 思路是,一发KMP,但是特别处理最后一位的失配边为0,这样就可以保证“判断完成但是不多判断”. 第二题,很毒瘤的题,要求求出,给定字符串A,B能够 ...

  7. vijos1083：小白逛公园

    小白逛公园 描述 小新经常陪小白去公园玩,也就是所谓的遛狗啦…在小新家附近有一条“公园路”,路的一边从南到北依次排着n个公园,小白早就看花了眼,自己也不清楚该去哪些公园玩了. 一开始,小白就根据公园的 ...

  8. Redis实现之数据库（三）

    过期键删除策略 在Redis实现之数据库(二)一小节中,我们知道了数据库键的过期时间都保存在过期字典中,又知道了如果根据过期时间去判断一个键是否过期,现在剩下的问题是:如果一个键过期了,那么它什么时候 ...

  9. synchronized 基本用法

    常见三种使用方式 1)普通同步方法,锁是当前实例:2)静态同步方法,锁是当前类的Class实例,Class数据存在永久代中,是该类的一个全局锁:3)对于同步代码块,锁是synchronized括号里配 ...

  10. java环境变量配置（Windows & Linux）

    前言: java 编程中 java 环境变量设置是开发最基础的要求,今天我们一起来学习相关要点和配置. 做些不太恰当但通俗易懂的比喻(个人理解): java 程序就好比汽车. jre(java 运行环 ...