禁用浏览器在支持触摸屏的设备上添加 overflow:hidden

Question

我在浏览器（可能只是 Chrome）在触控设备上添加 css 规则时遇到问题。

在我们为客户创建的网站上（专门用于 Chrome），当从他们的超极本访问时，滚动条在页面上的元素上消失了。客户仍在使用这些作为普通笔记本电脑，因此无需删除滚动。问题似乎是因为它们有触摸屏，浏览器会自动将这些 css 规则添加到某些元素：

overflow: hidden;
width: auto;

这会删除滚动条并破坏网站，因为许多元素不再能够完全交互。

我对此进行了一些研究，但没能找到多少（我一直得到的所有结果都是关于想要 overflow:hidden 在移动设备上使用的人）。 我希望 Chrome 中有一些设置可以禁用它，但我什么也没找到。我也知道可以添加一些强制性 CSS 规则...但这可能只会打开另一个蠕虫罐头。

非常感谢任何帮助。

谢谢

Answer 1

我找到了自己的答案。

在 Chrome 中，转到 chrome://旗帜

向下大约 1/3，有一个名为“启用触摸事件”的设置。

Chrome 说明：

Enable touch events : Mac, Windows, Linux, Chrome OS

Force touchscreen support to always be enabled or disabled, or to be enabled when a touchscreen is detected on startup (Automatic, the default). #touch-events

Select 下拉菜单中的“已禁用”。在他们做出选择后，window 底部会出现一个按钮，上面写着“立即重新启动”。单击它后，Chrome 将重新启动。现在应该会出现滚动条。