超小Web手势库AlloyFinger.txt

超小Web手势库AlloyFinger

Github看看：
https://github.com/AlloyTeam/AlloyFinger

官网demo:
http://alloyteam.github.io/AlloyFinger/

在腾讯，如：兴趣部落、QQ群、QQ动漫、腾讯学院、TEDxTencent、 AlloyTeam、腾讯CDC等多个部门、
团队和项目都在使用AlloyFinger

优点：
体积小，功能全，相比于hammer.js
支持npm安装（在vue项目中很好用）
npm install alloyfinger

事件
支持pinch缩放
支持rotate旋转
支持pressMove拖拽
支持doubleTap双击
支持swipe滑动
支持longTap长按
支持tap按
支持singleTap单击

快速上手
独立版使用方式:
//element为需要监听手势的dom对象
new AlloyFinger(element, {
    pointStart: function () {
        //手指触摸屏幕触发
    },
    multipointStart: function () {
        //一个手指以上触摸屏幕触发
    },
    rotate: function (evt) {
        //evt.angle代表两个手指旋转的角度
        console.log(evt.angle);
    },
    pinch: function (evt) {
        //evt.scale代表两个手指缩放的比例
        console.log(evt.scale);
    },
    multipointEnd: function () {
        //当手指离开，屏幕只剩一个手指或零个手指触发
    },
    pressMove: function (evt) {
        //evt.deltaX和evt.deltaY代表在屏幕上移动的距离
        console.log(evt.deltaX);
        console.log(evt.deltaY);
    },
    tap: function (evt) {
        //点按触发
    },
    doubleTap: function (evt) {
        //双击屏幕触发
    },
    longTap: function (evt) {
        //长按屏幕750ms触发
    },
    swipe: function (evt) {
        //evt.direction代表滑动的方向
        console.log("swipe" + evt.direction);
    },
    singleTap: function (evt) {
        //单击
    }
});

react版使用方式:

render() {
    return (
        
 
            
  
   你要监听手势的Dom!
  
        
 
    );
}