如何让浏览器捏缩放以使用hammer.js捏事件？ [英] How can I keep the browser pinch to zoom and use the hammer.js pinch events?

问题描述

这是我的代码...只是一个简单的测试，因为我之前从未使用过hammer.js：

Here is my code... just a simple test as I have never used hammer.js before:

var hammerTime = new Hammer($('#hammerTarget').get(0));

hammerTime.add(new Hammer.Pinch({event: 'pinch'})); // Add pinch gesture events.

hammerTime.on('pinchin', function(event) {
    console.log('hammer pinchin');

}).on('pinchout', function(event) {
    console.log('hammer pinchout');

}).on('pinchend', function(event) {
    console.log('hammer pinchend');
});

这个工作正常，我可以检测到捏，但现在在我的捏目标上我无法缩放浏览器了？如何使用夹点事件并允许默认浏览器捏缩放？我需要在压力上做一些事情，但我仍然希望人们能够放大。

This works fine, I can detect the pinch, but now on my pinch target I can't zoom the browser any more? How can I use the pinch event and allow the default browser pinch zooming? I need to do some stuff on pinch but I still want people to be able to zoom in.

我正在使用hammer.js 2.0.4以防万一。

I'm using hammer.js 2.0.4 in case it matters.

推荐答案

我也遇到了困难，直到遇到触摸动作属性。通过将其设置为自动，锤子停止阻止事件，并允许浏览器进行自己的缩放。

I was having a hard time with this too, until I came across the touch-action property. by setting it to auto, hammer stops blocking the events, and allows the browser to do it's own zoom.

var hammerTime = new Hammer($('#hammerTarget').get(0), {touchAction : 'auto'});

hammerTime.add(new Hammer.Pinch({event: 'pinch'})); // Add pinch gesture events.

hammerTime.on('pinchin', function(event) {
    console.log('hammer pinchin');

}).on('pinchout', function(event) {
    console.log('hammer pinchout');

}).on('pinchend', function(event) {
    console.log('hammer pinchend');
});

参见文档： http://hammerjs.github.io/touch-action/

这篇关于如何让浏览器捏缩放以使用hammer.js捏事件？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！