21

试图隐藏书签为主屏幕图标的 Web 应用程序的 Safari UI 组件。我正在使用这个元标记

<meta name="apple-mobile-web-app-capable" content="yes" />

如iPhone 开发中心所指定，但从主屏幕图标启动时地址栏和工具栏仍然存在。我需要做些什么不同的事情？有人有例子吗？

4

13 回答 13

30 
window.top.scrollTo(0, 1);

适用于 iPhone，但不适用于 iPad。我已经成功地通过使用

<meta name="apple-mobile-web-app-capable" content="yes" />

并从主屏幕链接启动。我也在使用

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

如果我忽略视口属性，我还没有尝试查看浏览器组件是否仍然隐藏。

于 2010-07-20T02:29:48.523 回答
7

它是从主屏幕启动的吗？链接页面上的文档没有提到，但我发现了这个@配置 Web 应用程序：

例如，您可以为 Web 应用程序指定一个图标，用于在添加到主屏幕时表示它，如“为 Web Clip 指定网页图标”中所述。当您的 Web 应用程序从主屏幕启动时，您还可以最小化 iPhone 上的 Safari 用户界面，如“更改状态栏外观”和“隐藏 Safari 用户界面组件”中所述。这些都是可选设置，添加到您的 Web 内容时会被其他平台忽略

于 2008-11-07T21:27:55.007 回答
6

你有没有尝试添加...

<meta name="apple-touch-fullscreen" content="yes" />
于 2010-01-04T21:58:30.953 回答
3

据我所知，iOS 仅在您实际添加应用程序时才关注标志。如果支持 apple-mobile-web-app-capable 的东西一开始不起作用，请尝试从主屏幕删除您的应用程序，然后重新添加它。

我进行了一些实验并发现：

  • 标头中元标记的位置似乎无关紧要（我认为可能！）
  • 添加应用程序并正确删除地址栏后，如果您随后从网页中删除元标记，iOS 将继续删除工具栏。
  • 即使重新启动设备后，它仍然“记住”是否删除工具栏。我发现重置此行为的唯一方法是删除并重新添加应用程序。

希望有帮助！

于 2011-10-19T22:27:35.887 回答
2

我知道这已经很老了，但是我在寻找解决方案时遇到了这个问题。我还可以通过添加以下内容来解决此问题：

window.top.scrollTo(0, 1);

到body的onload方法。希望它可以帮助其他遇到此问题的人。

于 2010-06-15T23:25:09.217 回答
1

iOS 浏览器考虑了一个名为“minimal-ui”的新指令（至少在我测试的 iPhone 上）。工具栏是隐藏的，直到用户点击顶部的状态栏。非常适合单页应用程序！

这是我使用的片段：

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

于 2014-05-16T22:07:40.953 回答
1

尝试这个

<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="viewport" content="width=device-width; user-scalable=0;">
<meta name="apple-mobile-web-app-status-bar-style" content="black">
<link rel="apple-touch-icon" href="icon.png">
于 2012-08-30T08:58:21.180 回答
0

那确实应该按预期运行，我过去使用它没有任何困难。

于 2008-11-08T16:30:49.803 回答
0 
<meta name="apple-mobile-web-app-capable" content="yes" />

适用于 iOS6 + 移动 Safari 浏览器，但仅当您在网站上包含元标记后将该页面添加到主屏幕时。

于 2013-03-07T12:20:14.510 回答
0 
<meta name="apple-mobile-web-app-capable" content="yes" />

这将在以下情况下起作用：

  1. 该标签在应用添加到主屏幕时存在。
  2. 该应用程序从主屏幕启动。
于 2012-09-12T16:47:33.130 回答
0

以上所有元标记和window.scrollTo，对我来说在ipad上不起作用，我在书签旁边找到了一个Safari上的按钮，您可以在其中获得一个名为“添加到主屏幕”的选项，它会创建一个新的磁贴图标，您可以启动您的Web 应用程序就像一个原生应用程序，并且没有地址栏。

于 2013-04-30T07:17:58.707 回答
0

从 iOS 7.1 开始，您可以使用minimal-ui

<meta name="viewport" content="width=device-width, initial-scale=1, minimal-ui">
于 2014-03-20T21:59:31.767 回答