【问题标题】:Hammer.js pan event only for touch devices and not for desktop computer Click+DragHammer.js 平移事件仅适用于触摸设备,不适用于台式计算机 Click+Drag
【发布时间】:2014-10-11 22:38:01
【问题描述】:

我将这个标准代码用于 Pan / Pinch (1) 和 Hammer.js :

var mc = new Hammer(document.body);

mc.add(new Hammer.Pinch({ threshold: 0 })).recognizeWith(mc.get('pan'));

// let the pan gesture support all directions. this will block the vertical scrolling on a touch-device while on the element
mc.get('pan').set({ direction: Hammer.DIRECTION_ALL });
mc.on("panleft panright panup pandown tap press pinchstart pinchmove", function(ev) {
    $('#myElement').text(ev.type +" gesture detected. ev.scale=" + ev.scale + "  ev.deltaX,Y=" + ev.deltaX +'  ' + ev.deltaY);
});

如何获得hammer.js pan 事件仅适用于触摸设备而不适用​​于台式机Click+Drag(因为我已经有台式机点击的工作代码+拖动,我不想重写这个!)

注(1)顺便问一下,这段代码好吗?为什么真的需要recognizeWith

【问题讨论】:

    标签: javascript ios mobile hammer.js


    【解决方案1】:

    您可以通过设置 inputClass 选项来强制 Hammer.js 使用您想要的输入类:

    var hammer = Hammer(element, {
      inputClass: Hammer.TouchInput
    })
    

    您可能还希望在可用时支持指针事件:

    var hammer = Hammer(element, {
      inputClass: Hammer.SUPPORT_POINTER_EVENTS ? Hammer.PointerEventInput : Hammer.TouchInput
    })
    

    Hammer.js 内置了以下 inputClasses:

    • 指针事件输入
    • 触摸输入
    • 鼠标输入
    • 触摸鼠标输入

    【讨论】:

      【解决方案2】:

      您可以检查事件 (ev) 对象中的 'pointerType' 属性值。 它应该是桌面的“鼠标”。

      【讨论】:

        猜你喜欢
        • 2017-06-02
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 2019-02-23
        • 2014-01-21
        • 1970-01-01
        • 2013-04-08
        相关资源
        最近更新 更多