Свиток hammer.js не работает с событиями пинчин и пинчут

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

Ашиш Марадия прекрасно работает для меня, но только на 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

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

Событие hammer.js pinch, pincin, pinchout всегда добавляет сенсорное действие: не работает ни одно свойство, кроме нашего свойства прокрутки

Answer 3

Попробуйте добавить этот CSS:

body {overflow-y:scroll;}

если позже вы захотите включить вертикальную и горизонтальную полосы прокрутки, используйте эту

body{ overflow: scroll; }