pentool icon indicating copy to clipboard operation
pentool copied to clipboard

Pinch-zoom on trackpads in modern browsers causes entire window to zoom

Open Martin-Pitt opened this issue 5 years ago • 0 comments

Hi,

There is an issue with the pinch-zoom at: https://github.com/baku89/pentool/blob/d00d1cd78412d2a4fc554041d038cae67f17b759/src/app.vue#L176-L187

Namely that without a e.preventDefault(); the entire page is zooming instead of only the artboard view.

To fix this, we need to add e.preventDefault();, but also addEventListener accepts a third argument for options, one of those event listener options is passive; This is enabled by default in modern browsers for performance reasons, so:

.addEventListener(e => …, { passive: false });

You can see an example of mousewheel listener here: https://codepen.io/nexii/pen/mzyLYJ

Martin-Pitt avatar Oct 04 '18 16:10 Martin-Pitt