移動開發框架，第【二】彈：Hammer.js 移動設備觸摸手勢js庫

【原創】作者：一只猿

原文地址：http://www.92ez.com

轉載請注明出處，謝謝

hammer.js是一個多點觸摸手勢庫，能夠為網頁加入Tap、Double Tap、Swipe、Hold、Pinch、Drag等多點觸摸事件，免去自己監聽底層touchstart、touchmove、touchend事件並且寫一大堆判斷邏輯的痛苦。hammer.js不但支持觸摸屏設備的瀏覽器，在桌面瀏覽器上，也能將鼠標的點擊當做觸摸，方便開發人員在桌面瀏覽器上調試。這是一個專為觸摸手勢而生的js庫，對有需要的朋友非常有幫助，奉上常用的一些方法調用文檔。

使用方法：

<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插件的形式調用

<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）