ピンチイン・ピンチアウトによるブラウザのズームを無効にする
JavaScriptを使って、スマートデバイスのブラウザでピンチイン・ピンチアウトを使ったズームを無効にする方法です。
2022.02.01時点で、次の内容でズームが無効になることを確認しています。
- Windows10 - タッチパネルでのChrome
- iOS15 - Chrome, Safari
body.addEventListener()
でtouchmove
イベントを受信し、2つ以上のタッチがあれば処理を無効にします。
document.body.addEventListener('touchmove', (e) => {
if (e.touches.length > 1) {
e.preventDefault();
}
}, {passive: false});