继续浏览精彩内容
慕课网APP
程序员的梦工厂
打开
继续
感谢您的支持,我会继续努力的
赞赏金额会直接到老师账户
将二维码发送给自己后长按识别
微信支付
支付宝支付

移动端判断滑动方向(上下左右)

安静的沙漠
关注TA
已关注
手记 6
粉丝 5
获赞 35
<script>
var mybody = document.getElementsByTagName('body')[0];
var startX, startY, moveEndX, moveEndY, X, Y;   
mybody.addEventListener('touchstart', function(e) {
    // e.preventDefault();
    startX = e.touches[0].pageX;
    startY = e.touches[0].pageY;
}, false);
mybody.addEventListener('touchmove', function(e) {
    // e.preventDefault();
    moveEndX = e.changedTouches[0].pageX;
    moveEndY = e.changedTouches[0].pageY;
    X = moveEndX - startX;
    Y = moveEndY - startY;
    if( Math.abs(X) > Math.abs(Y) && X > 0 ) {// right
        alert('向右');
    }
    else if( Math.abs(X) > Math.abs(Y) && X < 0 ) {// left
        alert('向左');
    }
    else if( Math.abs(Y) > Math.abs(X) && Y > 0) {// down
        alert('向下');
    }
    else if( Math.abs(Y) > Math.abs(X) && Y < 0 ) {// up
        alert('向上');
    }
    else{//没有发生滑动
        alert('没有发生滑动');
    }
});
打开App,阅读手记
1人推荐
发表评论
随时随地看视频慕课网APP