在横向时隐藏 iPhone 主屏幕 Web 应用程序中的状态栏

Question

是否可以在主屏幕网络应用程序中隐藏（完全删除，而不是更改样式）iOS Safari 状态栏？

当您在 Safari 中以横向模式浏览网页时，状态栏会在开始滚动后与浏览器 chrome 的其余部分一起消失。

我要添加到主屏幕的网络应用程序（如果适合显示屏的大小）则不可滚动。

设置后：

<meta content='initial-scale=1, maximum-scale=1, user-scalable=no' name='viewport'>
<meta content='yes' name='apple-mobile-web-app-capable'>
<meta content='white-translucent' name='apple-mobile-web-app-status-bar-style'>

所有浏览器镶边都消失了，但无论屏幕方向如何，状态栏信息仍覆盖在页面顶部。可以隐藏吗？

Answer 1

没有直接的方法（see: similar question）但是...这个链接看起来很有希望：

• Everything Hybrid Web Apps Need to Know About the Status Bar in iOS7

---

链接摘要如下：

关键评论（链接处）：

在 Safari 中查看网站时，您无法自定义 状态栏以任何方式。以前的 iOS 版本提供 以全屏模式查看网站的能力，但在 iOS7，见
http://www.mobilexweb.com/blog/safari-ios7-html5-problems-apis-review。

---

主要说明（在链接中）：

StatusBar Cordova 插件

Apple 在 iOS7 中引入了一些原生的 Objective C API 来控制 状态栏。由于 Cordova，我们有能力弥合这些 将原生 API 直接转换为 JavaScript API。
幸运的是，@shazron 已经用 StatusBar plugin 做到了这一点。

将插件添加到您的应用程序后，您将获得一个状态栏 具有多种方法来操作状态栏的对象 直接使用 JavaScript。
...
您可以使用 StatusBar.hide() 隐藏状态栏，甚至可以更改其 背景颜色与 StatusBar.backgroundColorByName() 或 StatusBar.backgroundColorByHexString().
例如，下面将状态栏设置为绿色。

<script>      
    document.addEventListener('deviceready', function() {
        StatusBar.overlaysWebView(false);
        StatusBar.backgroundColorByName('green');
    }, false);
</script>

...
未决问题

虽然网络已经为大多数 iOS7 状态提供了解决方法 酒吧问题，还有一些没有解决。

• 状态栏仍然覆盖在cordova InAppBrowser 中显示的内容。 没有已知的解决方法，但解决方法是 slated for cordova 3.2。
• StatusBar 插件在将设备锁定为横向模式的应用中不起作用。

---

关键评论评论（链接）：

这些解决方案似乎只适用于 Phonegap 应用程序，因为 我们这些不使用它并只是将我们的应用程序包装在 webview 中的人 唯一简单的解决方案是将 webview 的 top 属性设置为 20 而不是零，这可以解决手头的问题。