5

我有一个 Web 应用程序，我之前已经设置了支持带有主屏幕书签的 iPhone 所需的元标记。该网站在 safari 中运行良好，并且作为将 apple-mobile-web-app-capable 设置为 yes 的书签，因此当您使用主屏幕链接时它删除了浏览器控件。

现在 iPhone 5 出来了，我意识到通过页面上的视口设置，它显示的网站在屏幕的顶部和底部都有黑条。我已经更改了我的视口元标记，以便它可以使用 iPhone 5 的全屏。但是，主屏幕书签使用新的视口标签并全屏显示的唯一方法是删除书签，然后重新添加它。

是否有另一种设置方法，以便已安装主屏幕书签的每个人都不需要删除并重新添加它以使网站全屏显示？

4

1 回答 1

5

这是我在 Burlin 在 Gist 上找到的解决方案。工作一种享受。https://gist.github.com/3840737

<!-- standard viewport tag to set the viewport to the device's width
  , Android 2.3 devices need this so 100% width works properly and
  doesn't allow children to blow up the viewport width-->
<meta name="viewport" id="vp" content="initial-scale=1.0,user-scalable=no,maximum-scale=1,width=device-width" />
<!-- width=device-width causes the iPhone 5 to letterbox the app, so
  we want to exclude it for iPhone 5 to allow full screen apps -->
<meta name="viewport" id="vp" content="initial-scale=1.0,user-scalable=no,maximum-scale=1" media="(device-height: 568px)" />
于 2012-12-07T18:58:36.270 回答