iPhone / iPod touch的Safari iOS 7中无法隐藏导航栏
我不相信有任何解决scheme使用javascript / css / html以编程方式隐藏栏，但让我试着描述一个问题。 我们是手机游戏开发者团队，我们一直在开发游戏一年。
iOS 7发布后，我们面临隐藏导航栏的问题。 一旦用户点击Safari浏览器的上部或下部，导航栏再次出现并隐藏游戏的所有控件。
我们迄今发现的唯一解决scheme是迫使用户：
- 旋转设备
- 滚动页面
- 将应用程序添加到主屏幕
这些替代品都不是可以接受的。 看起来苹果已经意识到了这个问题，但一直忽略它。 他们已经closures了一个错误报告＃14076889。
我相信我们不是唯一遇到同样问题的球队。 有谁知道解决scheme？
2014年9月更新：iOS 8已经删除了minimal-uifunction除了依赖于默认的浏览器行为，滚动条会被隐藏，但只有在滚动元素是BODY这一页）。 唯一的“解决方法”是将应用程序保存到主屏幕，并设置适当的元标记（见下文）。
2014年8月更新：iOS 8（beta）不再支持minimal-ui 。 没有解决方法。 （其原因可能是由于网站的滥用，使用它来阻止人们离开，因此iOS 8 Safari中可能还有一些新function尚未公开，可以取代minimal-ui 。）
iOS 7.1添加了一个新的API来解决这个问题：
<meta name="viewport" content="minimal-ui">
这个新的视口标志默认隐藏Safari UI（只显示一个带有URL和SSL指示器的小标题栏）。 要访问Safari用户界面，用户必须主动点击该标题栏。
请注意， 在iOS 7.0.x上，没有API或已知的解决方法 。 在这些版本中，如果要永久隐藏Safari浏览器的浏览器，则需要让用户将Web应用程序添加到主屏幕（将适当的元标记设置为<meta name="apple-mobile-web-app-capable" content="yes"> ）或使用某种类似Phonegap的本地应用程序包装，并通过App Store进行分发。
就我个人而言，我希望他们没有删除他们在iOS 6 Mobile Safari上以横向模式引入的“全屏”button，这是一个让开发人员和用户感到满意的绝佳解决scheme。
对于这个需要更长时间解决的最佳候选对象是Mobile Safari支持HTML5全屏API（在OS X上的Safari支持）。 唉，现在还没有支持，历史上iOS版本发布没有添加新的Safarifunction，所以也许这是iOS 8的东西。
更新 ：有一个元属性来解决这个目前在iOS7.1testing版本根据这个论坛发布在发行说明。
<meta name="viewport" content="minimal-ui">
我已经运行testing，可以确认此function目前在Beta 2中。
注意 ：新的minimal-ui选项是一个很好的解决scheme，但它需要成为HTML响应的一部分。 我试着在iOS7.1 beta3上添加JS的视口元标记
$('head').append('<meta name="viewport" content="width=device-width, user-scalable=0, minimal-ui">');
浏览器忽略“minimal-ui”的值。
更新：iOS7.1现在已经发布，所以NDA已经解除了。
<meta name="viewport" content="minimal-ui">
确实是正确的标签，并在现场发布的作品。 请记住，如果需要，“视口”可以支持逗号分隔的列表。
我将其与其他移动variables结合起来，使网站感觉像一个应用程序：
<meta name="viewport" content="user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimal-ui">
–
我们也一直在苦苦挣扎。 我们在我们的网站上有一个TabBar，每次你尝试点击一个标签Safari浏览器控件popup。
今天希望。 如果你是苹果开发者计划的成员，我强烈build议访问这个论坛： https ： //devforums.apple.com/message/927476
w ^
编辑2：
从iOS 7.1开始不起作用
编辑：
一些游戏已经采用了一个覆盖层， 提示玩家滚动条 ，然后locking滚动，直到酒吧再次popup。 在这种情况下， position: fixed会有很大的帮助，因为它可以稳定运动（不能更好地解释它，只需要自己尝试一下）。 这个游戏就是这种方法的一个很好的例子：
http://www.paf.com/mobile/launch/flowers.html（抱歉，不能发布超过2个链接）;
最近我也偶然发现了一个停用顶层导航栏的黑客攻击。 所有你需要做的是添加一个随机的元素到你的DOM中，具有以下样式：
z-index: 100000; /* should be bigger than everything else */ position: fixed; overflow: scroll; -webkit-overflow-scrolling: touch;
在这里阅读更多关于它。
如果您正在创build一个Web应用程序，则可以在主屏幕上创build一个指向该URL的链接; 并使用以下HTML元标记：
<!-- Allows fullscreen mode from the Homescreen --> <meta name="apple-mobile-web-app-capable" content="yes"> <!-- Sets the color of the text/battery, wireless icons etc --> <meta name="apple-mobile-web-app-status-bar-style" content="black">
这将超过您的标题/导航栏强加指标。 （您在所有iPad屏幕上看到的指标。
有关更多信息，请参阅： https ： //developer.apple.com/library/safari/documentation/AppleApplications/Reference/SafariHTMLRef/Articles/MetaTags.html
希望这可以帮助某人，但我不想设置我的视口宽度=设备宽度..因为它在iPhone 4上的480像素..我希望我的游戏在800像素的所有设备。
如果你没有设置它，那么minimal-ui不会注册。
我的工作是做：
<meta name="viewport" content="width=device-width, minimal-ui">
然后在加载页面后更改视口：
$(window).load(function(){ $('meta[name=viewport]').attr('content','width=800, maximum-scale=1') });
我很震惊它的作品。 只有当用户点击屏幕的顶部/底部时，地址栏和较低的UIbutton才会出现。 现在爱它。
这个解决scheme为我工作，但在我的情况下，webapp是一个私人公众，在那里我可以控制将使用的ipad。
我试图使用所有可能的meta标签和黑客，而且在IOS8删除了minimal-ui特性之后，实际上不可能解决这个问题。
在框外思考，我们的团队达成了一个很好的解决scheme：
Mercury浏览器全屏打开，即使页面正在充电，地址栏也不会显示。 它是右下angular的一个小图标:)只能用于我们的问题！
但是我再说一遍：如果你正在为公众开发一个web应用程序，就不要使用它。 用户体验用户下载不同的浏览器访问应用程序是非常糟糕的。
UPDATE
我的开发者朋友提出了这个解决scheme：
在Appcelerator中使用Titanium内部的webview。 它不会被苹果商店，但私人活动，它会工作得很好！
