在 iPhone 上隐藏 Safari 用户界面组件
尝试隐藏标记为主屏幕图标的 Web 应用程序的 Safari UI 组件。 此元标记
<meta name="apple-mobile-web-app-capable" content="yes" />
我正在使用iPhone 开发中心，但从主屏幕图标启动时地址栏和工具栏仍然存在。 我需要做哪些不同的事情？ 有人有例子吗？
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（13）
适用于 iPhone，但不适用于 iPad。 我已经成功隐藏了 iPad 上的浏览器组件（大概是无处不在）
通过使用主屏幕链接并启动， 。 我还
没有尝试查看如果我忽略视口属性，浏览器组件是否仍然隐藏。
Works on iPhone, but not in iPad. I have been successful hiding the browser components on iPad (so presumably everywhere) by using
and launching from a home-screen link. I am also using
I have not tried seeing if the browser components are still hidden if I leave out the viewport properties.
它是从主屏幕启动的吗？ 链接页面上的文档没有提及，但我发现了这个@ 配置 Web 应用程序：
Is it being launched from the home screen? The documentation on the linked page does not mention but I found this @ Configuring Web Applications:
您是否尝试过添加...
Have you tried adding...
据我所知，iOS 仅在您实际添加应用程序时才会关注这些标志。 如果支持 apple-mobile-web-app-capable 的东西一开始不起作用，请尝试从主屏幕删除您的应用程序，然后重新添加它。
我进行了一些实验并发现：
希望有帮助！
From what I can tell, iOS only pays attention to the flags when you actually add the app. If the apple-mobile-web-app-capable thingy doesn't work at first, try deleting your app from the home screen then re-adding it.
I've run some experiments and found:
Hope that helps!
我知道这已经很老了，但我在寻找解决方案时遇到了这个。 我还可以通过添加：
到主体的 onload 方法来解决此问题。 希望它能帮助其他遇到这个问题的人。
I know this is pretty old, but I came across this while searching for a solution. I was able to fix this by also adding:
to the body's onload method. Hope it helps anyone else coming across this.
iOS 浏览器考虑了一个名为“minimal-ui”的新指令（至少在我测试的 iPhone 上）。 工具栏一直隐藏，直到用户单击顶部的状态栏。 对于一页应用程序来说非常好！
这是我使用的代码片段：
There is a new directive, called "minimal-ui" that iOS browser takes into account (at least on the iPhone where I tested). Toolbars are hidden until the user clicks on the status bar on top. Very nice for one page apps!
Here is the snippet I use:
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no, minimal-ui">http://developer.apple.com/library/safari/documentation/AppleApplications/Reference/SafariWebContent/ConfiguringWebApplications/ConfiguringWebApplications.html#//apple_ref/doc/uid/TP40002051-CH3-SW2
它有效在 iOS 4.0 上。
http://developer.apple.com/library/safari/documentation/AppleApplications/Reference/SafariWebContent/ConfiguringWebApplications/ConfiguringWebApplications.html#//apple_ref/doc/uid/TP40002051-CH3-SW2
It works on iOS 4.0.
尝试这个
Try this
从 iOS 7.1 开始，您可以使用
minimal-uiSince iOS 7.1, you can use
minimal-ui这确实应该像预期的那样，我过去使用过它，没有任何困难。
That should indeed behave as expected, I have used it in the past without any difficulties.
如果满足以下条件，这将起作用：
This will work if:
适用于 iOS6 + 移动 Safari 浏览器，但仅当您在网站上包含元标记后将页面添加到主屏幕时。
works on iOS6 + Mobile Safari Browser but ONLY if you added the page to your homescreen AFTER you included the meta tag on your site.
以上所有元标记和 window.scrollTo 对我来说在 ipad 上不起作用，
我在 Safari 上的书签旁边发现了一个按钮，您可以在其中找到一个名为“添加到主屏幕”的选项，它会创建一个新的磁贴图标，您可以像本机应用程序一样启动您的网络应用程序，并且那里没有地址栏。
all above meta tags and window.scrollTo, did not work on ipad for me,
i found a button on safari next to bookmarks where you get an option called 'Add to Home Screen' it creates a new tile icon, and you can launch your web app like a native app, and no address bar there.