可捏的缩放，但允许使用JavaScript

Question

Tl; dr：

我需要一个JavaScript解决方案，该解决方案可以禁用捏合缩放，但可以保留垂直的两指滚动在触摸板上。

---

以触摸板的设备上讲 - 像笔记本电脑一样！ - 用户可以通过简单地捏住或张开两个手指来“放大”到网页。此外，用户可以通过使用两个手指来降低页面的能力。这称为“两指滚动”。

某些上下文

---

我一直在开发一个在线应用程序，该应用程序依赖于特定的缩放功能作为其功能的一部分。

由于应用程序的主要部分是放大网格，我需要禁用这种自动捏到Zoom的手势，该手势烦人地放大了页面的contemantcontent

，而不是网格本身。

我已经尝试了什么 thank，在进行了大量研究之后，我终于找到了一个答案，可以防止用户能够

缩至Zoom。 （下面显示的代码）

javascript

window.addEventListener('wheel', event => {
    event.preventDefault() // Disable default behaviour
},{
    passive: false // Very important. Can be easy to overlook 
})

问题

这种方法效果很好。但是，当前的问题是 - 尽管此代码确实确实禁用了触摸板上的捏合缩放，但它会禁用标准的两指滚动。结果，对于带有触摸板的设备，我的应用程序中的某些主要基于文本的部分完全隐藏了视图，因为两指滚动也被禁用。 我正在寻找一种用于触摸板的JavaScript解决方案，该触摸板可以禁用捏合缩放，但可以保留两指滚动。我是否缺少代码中明显的东西？我需要手动检测每个手指输入才能工作吗？对任何建议开放！

请注意：

我知道通常不愿在网页上禁用捏合Zoom，但是如前所述，此应用程序是必要的。

提前感谢！！！

滚动和变焦事件之间的一个差异似乎是在这些事件中自动设置为

wheel自动设置为ctrlKey

。有了这些知识，您可以尝试一下：

---

true

window.addEventListener( 'wheel', event => { event.ctrlKey && event.preventDefault() }, { passive: false })

Answer 1

似乎可以解决这个技巧。