滑動屏幕 touchstart:接觸屏幕時觸發,touchmove:活動過程觸發,touchend:離開屏幕時觸發
首先獲取手接觸屏幕時的坐標X,Y
//獲取接觸屏幕時的X和Y
$('body').bind('touchstart',function(e){ startX = e.originalEvent.changedTouches[0].pageX, startY = e.originalEvent.changedTouches[0].pageY; });
然后獲取滑動的坐標,並使用后面的坐標減去前面的坐標,通過獲取的值判斷其滑動方向。因為手滑動方向一般不是水平或者垂直的,所以可使用Math.abs()進行比較,比如:像右上角滑動,當往上滑動的距離大於往右的距離時,取其往上滑動的距離,即往上滑動。
$('body').bind('touchmove',function(e){
//獲取滑動屏幕時的X,Y
endX = e.originalEvent.changedTouches[0].pageX,
endY = e.originalEvent.changedTouches[0].pageY;
//獲取滑動距離
distanceX = endX-startX;
distanceY = endY-startY;
//判斷滑動方向
if(Math.abs(distanceX)>Math.abs(distanceY) && distanceX>0){
console.log('往右滑動');
}else if(Math.abs(distanceX)>Math.abs(distanceY) && distanceX<0){
console.log('往左滑動');
}else if(Math.abs(distanceX)<Math.abs(distanceY) && distanceY<0){
console.log('往上滑動');
}else if(Math.abs(distanceX)<Math.abs(distanceY) && distanceY>0){
console.log('往下滑動');
}else{
console.log('點擊未滑動');
}
});

