1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
/*
author:grycheng
本次封装触屏事件实现触屏操作更加细腻
调用方式:
$(xxx).touchme(event,function(distance,type,axis){
//distance:代表x轴或者y轴偏移(以偏移更多的一个方向为准) 可为正值或负值,代表不同方向的偏移
//type:为move时表示当前触发的是touchmove事件,为click时触发的是touchend事件
//axis:为x代表x轴偏移,为y代表y轴偏移
});
*/
$.fn.touchme = function(event,fn){
var startele = $(this);
var touch = event.targetTouches[0];
var endPos = false;
startPos = {x:touch.pageX,y:touch.pageY,time:+new Date};
isScrolling = 0;
startele.bind("touchmove",function(event){
if(event.targetTouches.length > 1 || event.scale && event.scale !== 1) return;
var touch = event.targetTouches[0];
endPos = {x:touch.pageX - startPos.x,y:touch.pageY - startPos.y};
isScrolling = Math.abs(endPos.x) < Math.abs(endPos.y) ? 1:0;
if(isScrolling === 0){
event.preventDefault();
fn(endPos.x,'move','x');
}else{
event.preventDefault();
fn(endPos.y,'move','y');
}
});
startele.bind("touchend",function(event){
var duration = +new Date - startPos.time;
if(isScrolling === 0){
fn(endPos.x,'click','x');
}else{
fn(endPos.y,'click','y');
}
startele.unbind("touchmove");
startele.unbind("touchend");
});
};