javascript - Prevent pinchzoom in Safari for OSX - Stack Overflow

admin管理员组

文章数量:1429060

I have a html5 application with several viewports. I intend to use HammerJS for providing pinch/zoom gesture on individual viewports. Currently, whenever I pinch in Safari/OSX, the whole window is zoomed in or out, and I want to prevent that. For iOS this works:

<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no, minimal-ui">

But it doesn't prevent zooming in OSX. Is there any other meta, css3 or javascript that works in Safari/OSX?

I have a html5 application with several viewports. I intend to use HammerJS for providing pinch/zoom gesture on individual viewports. Currently, whenever I pinch in Safari/OSX, the whole window is zoomed in or out, and I want to prevent that. For iOS this works:

<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no, minimal-ui">

But it doesn't prevent zooming in OSX. Is there any other meta, css3 or javascript that works in Safari/OSX?

• javascript
• macos
• safari
• gesture
• hammer.js

Share Improve this question Follow asked Apr 6, 2016 at 18:04 JaimeJaime 5,98544 gold badges2525 silver badges5353 bronze badges

Add a ment  | 

1 Answer 1

Sorted by: Reset to default 7

Since Safari 10.1+, you can hook into the GestureEvent on macOS/OSX.

window.addEventListener('gesturestart', e => e.preventDefault());
window.addEventListener('gesturechange', e => e.preventDefault());
window.addEventListener('gestureend', e => e.preventDefault());

The above will prevent any gesture from firing (e.g. pinch to zoom). You can also handle those events, hooking into scale and rotation values.

本文标签： javascriptPrevent pinchzoom in Safari for OSXStack Overflow