Hammer.js是一个专门用于控制、定制手势的JavaScript库。它可以识别出常见的触摸、拖动、长按、缩放等等,对于希望在网页上对手势有所处理的朋友们,应该很有帮助。

如何使用

Hammer.js和其它JS库并没有很大不同,其主要提供的是数个手势的事件,这样开发者只需在特定的手势中绑定自己的处理函数即可。

首先,包含Hammer.js本身:


之后,需要将接受手势事件处理的区域,绑定在Hammer.js对象上:

var hammer = new Hammer(document.getElementById("container"));

现在就可以绑定各种手势事件了:

hammer.ondragstart = function(ev) { };
hammer.ondrag = function(ev) { };
hammer.ondragend = 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.js也提供了自己的jQuery插件,允许开发者使用已经习惯的jQuery开发语法,不过需要搭载不同的JS文件才可以。

许可证

该库使用MIT协议发行。

About liuyanghejerry

富有激情的前端工程师,专注GUI开发。

3 Thoughts on “Hammer.js – 专业的手势控制JavaScript库

  1. 我顶! 国人也要给力!

  2. jquery.hammer.js的用法:

    $(“#element”)
    .hammer({
    // 对DOM进行一些初始化,这里可以加入一些参数
    })
    .bind(“tap”,function(ev){
    console.log(ev);
    });

Post Navigation