html - 禁用浏览器添加溢出 :hidden on touch screen enabled devices

Question

我在浏览器(可能只是 Chrome)在支持触摸的设备上添加 css 规则时遇到问题。

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

overflow: hidden;
width: auto;

这会移除滚动条，并破坏网站，因为许多元素无法再完全交互。

我对此做了一些研究，但没能找到太多(我不断得到的所有结果都是关于人们想要溢出:隐藏在移动设备上的)。我希望 Chrome 中有一些设置可以禁用此功能，但我什么也没找到。我也知道可以添加一些强制的 CSS 规则……但这可能只会打开另一个蠕虫 jar 头。

非常感谢对此的任何帮助。

谢谢

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

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