您的位置:首页 > 其它

touch滑动判断方向

2016-12-27 14:51 169 查看
<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>
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: