Question

我使用hammer.js捕捉pinchin和pinchout事件并更改页面的字体大小。所以，我写了以下代码：

        var touch_area = document.getElementById('touch-area');
        var hammertime = Hammer(touch_area).on("pinchin pinchout", function (ev) {
            //alert(ev.type);
            if(ev.type=="pinchin")
                decreaseFontSize();
            else
                increaseFontSize();

        });

它可以工作，但它会禁用垂直滚动。我该如何解决？有什么建议吗？

Answer 1

Ashish Maradiya的作品对我很好，但仅适用于Android。

经过大量研究后，我只使用此代码在Android和iphone中实现了这一目标：

    var mc = new Hammer.Manager(myElement, {
        touchAction: 'manipulation'
    });
    mc.add([new Hammer.Pinch()]);

    mc.on("pinchin", function (ev) {
        //code
    });
    mc.on("pinchout", function (ev) {
        //code
    });

Answer 2

将css属性应用于您的（#touch-area）div

＆＃13;

#touch-area{
touch-action: pan-x pan-y !important;
}

＆＃13;

hammer.js捏，pincin，pinchout事件总是添加touch-action：none属性比我们的滚动属性不起作用

Answer 3

尝试添加此css：

body {overflow-y:scroll;}

如果以后，您希望启用垂直和水平滚动条，请使用此

body{ overflow: scroll; }

hammer.js滚动不使用pinchin和pinchout事件

3 个答案: