In my code
`
var old_zr;
var old_yr;
var hammertime = new Hammer(document.getElementById("sliderContainer"), {
direction : Hammer.DIRECTION_ALL,
threshold : 0
});
hammertime.get('pinch').set({ enable: true });
hammertime.on('pinch', function(ev) {
s = ev.distance/10;
});
hammertime.on('panstart', function(ev) {
old_zr = cz;
old_yr = cy;
});
hammertime.on('pan', function(ev) {
var dx = old_zr-ev.deltaX;
var dy = old_yr+ev.deltaY;
dx = dx % 360;
if (dx > 180) {
dx = -360 + dx;
} else if (dx < -170) {
dx = 360 + dx;
}
var yrR = Math.round(dy/10)*10;
zrR = zrR == -180 ? 180 : zrR;
zrR = zrR == 190 ? -170 : zrR;
var zrR = Math.round(dx/10)*10;
yrR = Math.max(0, Math.min(90, yrR))
cz = zrR;
cy = yrR;
document.getElementById("val").innerHTML = zrR + "," + yrR;
});
`
I noticed a couple of issues. First is I can't pan vertically. I can pan horizontally though. Vertical panning only works if I first pan horizontally which is weird. In my page there is no vertical scroll bar anyways, so is there a way I can override something and make vertical panning work?
The second issue is pinch to zoom feature. It doesn't seem to work at the same time as when I enable panning. Google maps works perfectly with pinch to zoom and panning. So I know it can be done. Does anyone know what's wrong?
Thanks
The documentation states somewhere, that Vertical Panning is not enabled per default and also gave an example to enable it. Have to say that it is hard to find and took me a whole working day...
mc.get('pan').set({direction: Hammer.DIRECTION_ALL });
@angabriel, thank you for pointing out the confusion.
I tried to better explain two different defaults in https://squadette.github.io/hammer.js/recognizer-swipe/ and https://squadette.github.io/hammer.js/recognizer-pan/
Most helpful comment
The documentation states somewhere, that Vertical Panning is not enabled per default and also gave an example to enable it. Have to say that it is hard to find and took me a whole working day...
mc.get('pan').set({direction: Hammer.DIRECTION_ALL });