移动端 ＜＜ Touch.js事件库 和 hammer.js 事件库

Touch.js

Touch.js是移动设备上的手势识别与事件库, 由百度云Clouda团队维护，也是在百度内部广泛使用的开发工具.(已停更)

Touch.js手势库专为移动设备设计,是Web移动端touch点击事件不错的解决方案

GitHub - Clouda-team/touchjs: Touchjs getsture library

用法：

//引入touchjs
<script src="js/touch-0.2.14.min.js"></script>

    /*
	    touch.on(1,2,3)
        三个参数：
	    1、DOM元素
	    2、移动端事件
	    3、处理函数
     */

var oBox = document.getElementsByTagName('div')[0];

touch.on(oBox, 'tap', function(e) {
     this.style.background = "red";
     this.style.color = '#fff'; 
});

hammer.js

一款开源的移动端脚本框架，他能完美的实现在移端开发的大多数事件，如点击、滑动、拖动、多点触控等事件

Getting Started - Hammer.js

用法：

//引入hammer文件
<script src="js/hammer.min.js"></script>

<script>
    //创建一个新的hammer对象并且在初始化时指定要处理的dom元素
    var hammertime = new Hammer(document.getElementById("test"));

    //添加事件
    // tap、swipe、rotate、press、pinch、pan等事件
    hammertime.on("tap", function(e) {

        document.getElementById("result").innerHTML += "点击触发了，长按无效<br />";

        //控制台输出,可以自行查看相关的参数
        console.log(e);
    });

</script>

支持移动端事件（部分）

属性	设备类型
tap	单击屏幕
doubletap	双击屏幕
swipe	滑动
swipeleft	向左滑动
swiperight	向右滑动
swipeup	向上滑动
swipedown	向下滑动
hold	长按屏幕
dragstart	拖动开始
drag	拖动
pinchstart	缩放手势起点
pinchin	缩小
pinchout	放大