通过JavaScript在iPhone和Android检测手指轻扫 [英] Detect a finger swipe through JavaScript on the iPhone and Android

查看:109
本文介绍了通过JavaScript在iPhone和Android检测手指轻扫的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

你怎么能检测到用户在一个网页的JavaScript?

How can you detect that a user swiped his finger in some direction over a web page with JavaScript?

我在想,如果有,将工作的同时在iPhone和Android手机网站的一个解决方案。

I was wondering if there was one solution that would work for websites on both the iPhone and an Android phone.

推荐答案

简单香草JS code样品:<​​/ P>

Simple vanilla JS code sample:

document.addEventListener('touchstart', handleTouchStart, false);        
document.addEventListener('touchmove', handleTouchMove, false);

var xDown = null;                                                        
var yDown = null;                                                        

function handleTouchStart(evt) {                                         
    xDown = evt.touches[0].clientX;                                      
    yDown = evt.touches[0].clientY;                                      
};                                                

function handleTouchMove(evt) {
    if ( ! xDown || ! yDown ) {
        return;
    }

    var xUp = evt.touches[0].clientX;                                    
    var yUp = evt.touches[0].clientY;

    var xDiff = xDown - xUp;
    var yDiff = yDown - yUp;

    if ( Math.abs( xDiff ) > Math.abs( yDiff ) ) {/*most significant*/
        if ( xDiff > 0 ) {
            /* left swipe */ 
        } else {
            /* right swipe */
        }                       
    } else {
        if ( yDiff > 0 ) {
            /* up swipe */ 
        } else { 
            /* down swipe */
        }                                                                 
    }
    /* reset values */
    xDown = null;
    yDown = null;                                             
};

经过测试,在Android的。

Tested in Android.

这篇关于通过JavaScript在iPhone和Android检测手指轻扫的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆