防止在移动版 Firefox 中输入字段焦点后放大
Posted
技术标签:
【中文标题】防止在移动版 Firefox 中输入字段焦点后放大【英文标题】：Prevent zooming in after input field focus in Firefox on mobile 【发布时间】：2021-11-28 08:47:45 【问题描述】：我想在 android Firefox（可能是 ios Safari）上聚焦 html 输入字段时禁用自动缩放。
我在 SO [1, 2, 3] 和网络上阅读了许多相关的古老线程，但既没有找到可行的解决方案，也没有找到明确的答案，这在 2021 年是不可能的。我拥有的唯一测试设备是 Android 手机（iOS 也可能发生这种情况），只有 Firefox 才会出现问题； Chrome 按预期工作（由我）。
我试过了：
在输入栏设置font-size: 16px
设置<meta name="viewport" content="width=device-width, initial-scale=1, max-scale=1" />
甚至出于绝望<meta name="viewport" content="width=device-width, initial-scale=1, max-scale=1, user-scalable=no">
Android 11、Firefox 93.1.0
我想要达到的目标真的不可能吗？
代码沙盒：https://y370s.csb.app/ [1]Disable Auto Zoom in Input "Text" tag - Safari on iPhone [2]Disable zoom on input focus in Android webpage [3]Disable zoom on input focus in Android smartphone【问题讨论】：
我也遇到了同样的问题。我向 Firefox 移动团队提交了this bug。 如 GitHub 帖子中所示，我提交的错误已移至 Bugzilla。见here。 感谢您的倡议！但如果它确实是一个错误，如果/当它最终得到修复，这意味着对于旧版本将无法实现这种效果。嗯，网络开发。有些东西肯定行不通…… 阅读线程，我相信设置minimum-scale=1, maximum-scale=1 适用于 94 之前的版本。只有 94 或
好吧，也许我应该阅读错误更新...我几周前才读到这篇文章，当你发布它时，但似乎已经完全照顾好了。感谢您的关注！如果您将其作为答案发布，我可以接受您并关闭问题。
【参考方案1】：
在 96 中修复
现在已为 Firefox Mobile 96 及更高版本修复此问题。错误线程中有一些迹象表明这在 94 之前的版本中不是问题，但我无法确切确认是哪个版本引入了此错误。
用minimum-scale=1和maximum-scale=1设置元标记，如：
<meta name="viewport" content="width=device-width, height=device-height, initial-scale=1, minimum-scale=1, maximum-scale=1" />
参考：Bug 1738696
在<meta name="viewport" 标记中设置user-scalable=no 将来会起作用，以及像touch-action: manipulation 这样设置CSS。关注Bug 1746126 以获取最新消息。
适用于所有移动浏览器
为防止输入字段在所有移动浏览器中缩放，我建议还包括user-scalable=no，以覆盖您的所有基础。所以最后的答案是把它放在你的<head>中。
<meta name="viewport" content="width=device-width, height=device-height, initial-scale=1, minimum-scale=1, maximum-scale=1, user-scalable=no" />
【讨论】：
以上是关于防止在移动版 Firefox 中输入字段焦点后放大的主要内容，如果未能解决你的问题，请参考以下文章