js判断手指上滑和下滑

来源:互联网 发布:大数据图标 编辑:程序博客网 时间:2024/04/27 20:46
<script>    var startX = 0,        startY = 0;    function touchStart(evt){        try{            var touch = evt.touches[0], //获取第一个触点                    x = Number(touch.pageX), //页面触点X坐标                    y = Number(touch.pageY); //页面触点Y坐标            //记录触点初始位置            startX = x;            startY = y;        }catch(e){            console.log(e.message)        }    }    function touchMove(){        try{            var touch = evt.touches[0], //获取第一个触点                    x = Number(touch.pageX), //页面触点X坐标                    y = Number(touch.pageY); //页面触点Y坐标            //判断滑动方向            if (y - startY>0) {                console.log('下滑了!');            }else{                console.log('上滑了!');            }        }catch(e){            console.log(e.message)        }    }    function touchEnd(){        try{            var touch = evt.touches[0], //获取第一个触点                    x = Number(touch.pageX), //页面触点X坐标                    y = Number(touch.pageY); //页面触点Y坐标            //判断滑动方向            if (y - startY>0) {                console.log('下滑了!');            }else{                console.log('上滑了!');            }        }catch(e){            console.log(e.message)        }    }    //绑定事件    function bindEvent(){        document.addEventListener('touchstart',touchStart,false);        document.addEventListener('touchmove',touchMove,false);        document.addEventListener('touchend',touchEnd,false);    }</script>
0 3
原创粉丝点击