1 $("body").on("touchstart", function(e) { 2 e.preventDefault(); 3 startX = e.originalEvent.changedTouches[0].pageX, 4 startY = e.originalEvent.changedTouches[0].pageY; 5 }); 6 $("body").on("touchmove", function(e) { 7 e.preventDefault(); 8 moveEndX = e.originalEvent.changedTouches[0].pageX, 9 moveEndY = e.originalEvent.changedTouches[0].pageY,10 X = moveEndX - startX,11 Y = moveEndY - startY;12 13 if ( Math.abs(X) > Math.abs(Y) && X > 0 ) {14 alert("left 2 right");15 }16 else if ( Math.abs(X) > Math.abs(Y) && X < 0 ) {17 alert("right 2 left");18 }19 else if ( Math.abs(Y) > Math.abs(X) && Y > 0) {20 alert("top 2 bottom");21 }22 else if ( Math.abs(Y) > Math.abs(X) && Y < 0 ) {23 alert("bottom 2 top");24 }25 else{26 alert("just touch");27 }28 });
测试例子可以点击这里进行访问:判断手指滑动方向DEMO
原标题:《移动端浏览器Touch事件判断手指滑动方向方法》
关键词:浏览器