title: How to prevent native browser default pinch to zoom behavior?
body: <p>This question has been asked in a couple different flavors, but none satisfy. </p>
  
  <p>The native browser (Google Chrome for Mac, for instance) supports the "pinch to zoom" gesture by default which will zoom the whole viewport. How do I disable (react to) this default behavior so I can write my own pinching/zooming logic? Google Maps <a href="https://maps.google.com/" rel="nofollow noreferrer">https://maps.google.com/</a> seems to have achieved this since pinching on the map will only scale the map area, leaving the rest of the UI intact, while pinching on the left sidebar shows the default behavior.</p>
  
  <p>I have tried a few approaches such as HTML <code>"viewport"</code> meta tag, CSS <code>touch-action: none;</code> and JavaScript <code>document.addEventListener('touchmove', e =&gt; { e.preventDefault() })</code>, but they all seem to only work on mobile.</p>