在 android chrome 浏览器中处于全屏模式时，元视口属性的值不会反映出来

Question

当我在 android 全屏模式下使用全屏 api 时，初始比例和用户可缩放等元视口属性的值不会反映在浏览器中。如果我未处于全屏模式，则会反映元视口的值。您可以通过从移动浏览器

我没有找到任何来源说元视口将在 android 中全屏禁用。那么我是在犯任何错误还是没有人记录下来？全屏时也禁用捏合和缩放

在 https://github.com/whatwg/fullscreen/issues/111 中提出了一个问题，但没有成功。

想知道是否有其他方法可以解决

Answer 1

很遗憾，答案是否定的，您无法控制元视口属性的处理方式。 “Full webpage and disabled zoom viewport meta tag for all mobile browsers”涵盖许多 Android 和 iOS 全屏版本。但是，您可以使用一系列浏览器/版本检测来解决已知错误。它并不优雅，但鉴于 Android 的碎片化，它可能是必要的。

Answer 2

我可以通过使用网络应用程序清单的替代方法进入全屏模式。它不会干扰元视口。

步骤如下

将此添加到头部：

<link rel="manifest" href="/manifest.json">

创建如下所示的清单文件：

 {
      "short_name": "App Name",
      "name": "Full app name",
      "icons": [
        {
          "src": "launcher-icon-4x.png",
          "sizes": "192x192",
          "type": "image/png"
        }
      ],
      "start_url": "/index.html",
      "display": "fullscreen",
      "orientation": "landscape"
  }

Google 使用清单全屏启动的开发人员文档可用 here。

已提出全屏禁用元视图端口的问题here。

在 android chrome 浏览器中处于全屏模式时，元视口属性的值不会反映出来

The values of meta viewport attribute are not reflected when in full screen mode in android chrome browser

javascript

css

fullscreen

viewport

responsive