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放大

更多推荐

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