防止缩放跨浏览器

新手上路,请多包涵

对于类似地图的工具,我想 禁用浏览器缩放功能(我知道这通常是一个坏主意,但对于某些特定的网站,它是必需的)。

我通过听键盘快捷键 CTRL + / CTRL - 并添加 e.preventDefault() 等成功地做到了。 但这并不能阻止从浏览器的缩放菜单中更改缩放。

我试过了:

  • 使用 CSS: zoom: reset; 它适用于 Chrome(请参阅 此页面以获取工作示例),但它在 Firefox 上根本不起作用。

  • 在各种问题/答案中,我还发现

<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">

但这似乎仅适用于移动设备。


如何防止跨浏览器缩放?

原文由 Basj 发布,翻译遵循 CC BY-SA 4.0 许可协议

阅读 403
1 个回答

我还没有真正找到一个“权威”的答案,这意味着浏览器开发人员的明确声明。然而,我发现的所有类似问题的答案(比如 这个那个)都暗示了同样的事情——浏览器的缩放功能是为了用户的利益而存在的,而一些浏览器(比如 Firefox)根本不允许你这样做,因为网站创建者,将此选项从他们手中夺走。


该文档 可能会阐明为什么允许作者禁用缩放在移动设备上可能是个好主意,但在台式机上却不是。

简而言之,如果您知道移动设备计算出的自动缩放是不合适的,您可能需要阻止移动设备最初自动缩放您的网站。 在台式机上,没有自动缩放功能,因此当用户访问您的网站时,他们看到的完全是原样。 如果他们随后决定需要缩放页面,则没有充分的理由让您阻止他们这样做。


至于您列出的解决方案:

原文由 hon2a 发布,翻译遵循 CC BY-SA 3.0 许可协议

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题
logo
Stack Overflow 翻译
子站问答
访问
宣传栏