Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Add Pointer Event gesture support for pinch zooming

See original GitHub issue

Hello,

Currently I am unable to zoom using pinch gestures on a Surface RT tablet with IE11, neither in metro interface, nor in desktop. Everything seems to be working well on Android and iOS, so I guess it has something to do with pointer events, which seem to be supported in the current version.

I have disabled the default touch interaction for the container which is used for zooming, using the -ms-touch-action: none; css style so that such events are handled in javascript, but to no avail.

Any idea what I might be doing wrong?

Thanks!

Issue Analytics

State:
Created 10 years ago
Comments:22 (5 by maintainers)

Top GitHub Comments

1reaction

ljanicommented, Sep 17, 2014

Finally, a workaround!

Here’s what I did:

I used the wonderful ie-touch.js
Set window.MSPointerEvent and window.PointerEvent to undefined to disable panzoom’s detection for pointer events and thus disable the broken pointer events implementation of panzoom and enable the touch api implementation instead.
Finally load jQuery and jQuery.panzoom
Example:

<head>
    ...
    <script src="ie-touch.js" type="text/javascript"></script>
    <script type="text/javascript">
        window.MSPointerEvent = undefined;
        window.PointerEvent = undefined;
    </script>
</head>
<body>
    ...
    <script src="jquery.js"></script>
    <script src="jquery.panzoom.js"></script>
</body>

Not the best solution, but something that at least I can live with. “Native” support for pointer events is still welcome, because of IE10.

0reactions

daverodalcommented, Apr 1, 2017

I have a Lenovo All in one with touch screen. I cannot get this to work with the touch screen either. Chrome or IE. I even tried above demo and pinch zoom did not zoom. mouse wheel works fine.

Top Results From Across the Web

Pinch zoom gestures - Web APIs | MDN

The pinch in (zoom out) gesture, which moves the two pointers toward each other, changes the target element's background color to lightblue ....

Pointer Event pinch/zoom gesture - CodePen

Pointer Event pinch /zoom gesture ... Touch and Hold with 2 pointers, then pinch in or out. The background color will change to...

Pinch me, I'm zooming: gestures in the DOM

When performing a pinch-zoom gesture, Firefox and Chrome produce a wheel event with a deltaY: ±scale, ctrlKey: true . They produce an identical ......

Implementing custom pinch gesture in AR - Babylon.js Forum

XR doesn't support pointer events. we emulate them for your convenience, but it is not a full pointer event. WebXR uses the select...

Pinch/zoom with pointer events in Javascript clarification

If two touching fingers are moved simultaneously with fixed distance, I assume the browser will generate interleaved pointer events for two ...