Hammer.js 移动设备触摸手势js库

hammer.js是一个多点触摸手势库，能够为网页加入Tap、Double Tap、Swipe、Hold、Pinch、Drag等多点触摸事件，免去自己监听底层touchstart、touchmove、touchend事件并且写一大堆判断逻辑的痛苦。hammer.js不但支持触摸屏设备的浏览器，在桌面浏览器上，也能将鼠标的点击当做触摸，方便开发人员在桌面浏览器上调试。这是一个专为触摸手势而生的js库，对有需要的朋友非常有帮助，奉上常用的一些方法调用文档。

使用方法：

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20

<script src= "http://eightmedia.github.com/hammer.js/hammer.js" ></script> // 先要对监听的DOM进行一些初始化 var hammer = new Hammer(document.getElementById( "container" )); // 然后加入相应的回调函数即可 hammer.ondragstart = function (ev) { };  // 开始拖动 hammer.ondrag = function (ev) { }; // 拖动中 hammer.ondragend = function (ev) { }; // 拖动结束 hammer.onswipe = function (ev) { }; // 滑动 hammer.ontap = function (ev) { }; // 单击 hammer.ondoubletap = function (ev) { }; //双击 hammer.onhold = function (ev) { }; // 长按 hammer.ontransformstart = function (ev) { }; // 双指收张开始 hammer.ontransform = function (ev) { }; // 双指收张中 hammer.ontransformend = function (ev) { }; // 双指收张结束 hammer.onrelease = function (ev) { }; // 手指离开屏幕

还支持jQuery插件的形式调用

1 2 3 4 5 6 7 8 9

<script src= "http://eightmedia.github.com/hammer.js/jquery.hammer.js" ></script> $( "#element" ) .hammer({ // 对DOM进行一些初始化，这里可以加入一些参数 }) .bind( "tap" , function (ev) { console.log(ev); });

官网地址：http://eightmedia.github.com/hammer.js/  （带演示）

源码地址：https://github.com/EightMedia/hammer.js

文件大小： 23K（源码）、6K（minified）