hammer
pan 拖拽手势
tap轻击
gesture 手势
touch 触摸
网址
http://hammerjs.github.io/jsdoc/manager.js.html
http://hammerjs.github.io/getting-started/
Manager原始方式
使用Manager创建，Manager实例本身不带任何识别对象，都需手动增加
属于事件绑定的基础方法，[直接快速方式]也是根据这个来的
举例：创建一个轻击4次事件，此为自定义分支
event事件名称，可任意起，可不给（不给将直接配置修改此识别器）
taps指定次数
此处例子属于自定义tap(轻击)事件
var mc = new Hammer.Manager(d1);
//增加识别对象
mc.add(new Hammer.Tap({ event: ‘quadrupletap‘, taps: 4 }));
mc.on(‘quadrupletap‘, function (ev) {
d1.innerHTML = (new Date()).getTime();
});
[取]识别对象
如果识别对象不存在，即没被添加，将取不到，返回null
mc.get(‘pan‘);
[增]识别对象
参数
不带参，将创建包含分支再内的所有分支
带参，指定event将创建新的识别，不指定event将修改所有系统识别
add方法，返回当前增加的对象
mc.add(new Hammer.Tap({ event: ‘quadrupletap‘, taps: 4 }));
某元素可以有多个识别，同类的不同类的都行，同类指 比如都是Tab类
直接快速方式
本质：根据manager扩展而来
var mc = new Hammer(d1);
mc.on("swipe", function (ev) {
d1.textContent = ev.type + " gesture detected.";
});
同时绑定多个
mc.on("panleft panright tap press", function(ev) {
myElement.textContent = ev.type +" gesture detected.";
});
拖拽 pan
|
Option |
Default |
Description |
|
event |
pan |
Name of the event. |
|
pointers |
1 |
Required pointers. 0 for all pointers. |
|
threshold |
10 |
Minimal pan distance required before recognizing. |
|
direction |
DIRECTION_ALL |
Direction of the panning. |
所有事件
pan, 包含下面的所有分支
panstart
panmove
panend
pancancel
panleft
panright
panup
pandown
缩放pinch
|
Option |
Default |
Description |
|
event |
pinch |
Name of the event. |
|
pointers |
2 |
Required pointers, with a minimal of 2. |
|
threshold |
0 |
Minimal scale before recognizing. |
所有事件
pinch, 包含下面的所有分支
pinchstart
pinchmove
pinchend
pinchcancel
pinchin
pinchout
事件关键 返回值
event.scale
长按 press
|
Option |
Default |
Description |
|
event |
press |
Name of the event. |
|
pointers |
1 |
Required pointers. |
|
threshold |
5 |
Minimal movement that is allowed while pressing. |
|
time |
500 |
Minimal press time in ms. |
Events
press
滑动 swipe
|
Option |
Default |
Description |
|
event |
swipe |
Name of the event. |
|
pointers |
1 |
Required pointers. |
|
threshold |
10 |
Minimal distance required before recognizing. |
|
direction |
DIRECTION_ALL |
Direction of the panning. |
|
velocity |
0.65 |
Minimal velocity required before recognizing, unit is in px per ms. |
Events
swipe, together with all of below
swipeleft
swiperight
swipeup
swipedown
轻击 tap
|
Option |
Default |
Description |
|
event |
tap |
Name of the event. |
|
pointers |
1 |
Required pointers. |
|
taps |
1 |
Amount of taps required. |
|
interval |
300 |
Maximum time in ms between multiple taps. |
|
time |
250 |
Maximum press time in ms. |
|
threshold |
2 |
While doing a tap some small movement is allowed. |
|
posThreshold |
10 |
The maximum position difference between multiple taps. |
Events
tap
hammer.input
你进行的任何动作都将触发
事件关键 返回值
ev.isFinal全部动作结束后为true，即所有事件最后一次调用为true
recognizeWith
识别对象的方法
为指定识别对象增加一个识别机会
比如下例，在rotate事件执行时，如果pinch结束，会不断的识别是否满足pinch情况，满足则重新开始pinch
var pinch = new Hammer.Pinch();
var rotate = new Hammer.Rotation();
pinch.recognizeWith(rotate);
on注册事件
事件触发顺序跟事件注册先后有关，先注册将先触发