隐藏 Safari 地址栏和页脚答案

【问题标题】：Hide Safari address bar and footer隐藏 Safari 地址栏和页脚
【发布时间】：2011-08-11 16:09:49
【问题描述】：

在我的 jQuery Mobile 项目中，我使用以下代码：

<meta name="viewport" content="width=device-width, minimum-scale=1, maximum-scale=1">

我正在获取 Safari 浏览器地址栏和导航页脚。我怎样才能隐藏这些，以便我可以只显示我的应用程序？

【问题讨论】：

标签： jquery-mobile safari viewport

【解决方案1】：

您可以设置一些元标记来告诉 iOS 您的网站可以作为 Web 应用添加到主屏幕。从那里启动后，所有 Safari 元素都将被隐藏。

查看标题为“隐藏 Safari 用户界面组件”here 的部分。

您可以指定应用程序在主屏幕上显示的启动启动画面图像和自定义图标。

<meta name="viewport" content="width=device-width, minimum-scale=1, maximum-scale=1">
<meta name="apple-mobile-web-app-capable" content="yes" />
<meta name="apple-mobile-web-app-status-bar-style" content="black" />
<link rel="apple-touch-icon" href="apple-touch-icon-57x57.png" />
<link rel="apple-touch-icon" sizes="72x72" href="apple-touch-icon-72x72.png" />
<link rel="apple-touch-icon" sizes="114x114" href="apple-touch-icon-114x114.png" />
<link rel="apple-touch-startup-image" href="apple-touch-startup-image-320x460.png" />
<link rel="apple-touch-startup-image" sizes="768x1004" href="apple-touch-startup-image-768x1004.png" />

【讨论】：

这是完美的。非常感谢分享。
+1。如果允许的话，我会更多地支持你:) 这为我节省了很多时间。谢谢
啊，关键是它需要从主屏幕启动才能隐藏Safari元素。我在 Safari 中对其进行了测试，但始终无法让它隐藏地址栏和页脚。
它工作正常，但是当我使用标签打开新页面时，它会在 safari 的新页面中显示 web 应用程序，并且地址栏再次显示。你知道为什么会这样吗？

【解决方案2】：

您不需要<meta> 标签。 jQuery mobile 应该负责隐藏 iOS 上的地址栏。我自己永远无法让导航页脚消失。

【讨论】：

我知道 Sencha Touch 可以很好地隐藏它们。我希望我能找到一个解决方案来摆脱这两种情况。
另外，您的元标记缺少高度。根据此链接forum.jquery.com/topic/… 这就是您可能正在尝试执行的操作
试过是我失去了我的标题工具栏：o/

【解决方案3】：

罗伯，尝试添加以下脚本。这应该可以在同一窗口中打开新请求

<script type="text/javascript">
    window.onload = function () {
        var a = document.getElementsByTagName("a");
        for (var i = 0; i < a.length; i++) {
            if (a[i].className.match("noeffect")) {
                // Does nothing
            }
            else {
                a[i].onclick = function () {
                    window.location = this.getAttribute("href");
                    return false;
                };
            }
        }
    };
</script>

【讨论】：

你应该使用 jQuery，因为 OP 正在使用它！