移动端事件

 

移动端事件库  （部分）

Touch.js

下载js网站：

GitHub - Clouda-team/touchjs: Touchjs getsture library

 

---

                  属性                                                                  设备类型

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

  用法

//引入touchjs
<script src="js/touch-0.2.14.min.js"></script>
/*
	touch.on(1,2,3)

    三个参数：
	1、DOM元素
	2、移动端事件
	3、处理函数

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

  示例

<script>
    var div = document.getElementsByTagName('div')[0];
    touch.on(div,'tap',function(){
        this.style.backgroundColor = 'red';
    });
    touch.on(div,'doubletap',function(){
        this.style.backgroundColor = 'green';
    });

    // 长按
    touch.on(div,'hold',function(){
        alert('长按');
        this.style.backgroundColor = 'yellow';

    })
    // 拖动
    touch.on(div,'drag',function(){
        
        this.style.backgroundColor = 'pink';

    })



</script>