2012-07-01 208 views
10

我正在为移动设备创建一个HTML5网络应用程序,并被要求隐藏浏览器导航栏(后退&前进按钮)(打字错误,此处为prev。)。我怎样才能做到这一点?HTML5全屏幕网络应用程序:没有浏览器栏

我认为我应该能够实现使用Phone Gap。但我想知道它是否可能用于“普通”网页应用程序来隐藏浏览器栏?我认为如果我将网站/应用程序固定到主屏幕,它可能会发生?

iPhone有http://ajaxian.com/archives/iphone-full-screen-webapps,但Andriod至少怎么样?

+0

你能够在你的应用程序中应用JQuery吗? – Asif

回答

8

我知道这个问题是一个有点过时了,在这一点上所以这里是一个更新:

在Safari上的iOS 7+该解决方案是伟大的:

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

最小的UI属性使得浏览器隐藏所有的按钮,同时保持任务栏完好。

我还没有测试过这个android。

7

如果您可以在您的网络应用程序中使用JQuery比我建议您去寻找NiceScroll插件。

它可用于移动和桌面浏览器,并将隐藏浏览器的滚动条。如果你的代码超出了浏览器的浏览器高度,那么它将会创建一个自定义的滚动条,如果它没有被使用,它将会消失。

这里是its Demo

编辑:
按照您的更新,我想补充一点,我其实不是一个本地移动web应用程序开发人员,但在检索您的问题,我发现了一些做题,可以帮助你带领进一步方式:

而且这些教程S:

+0

Ops,我的坏,我的意思是浏览器栏。具有后退和前进按钮的那个 –

+1

您是否在考虑“_Automatic F11 Script_”? – Asif

+0

哦,我刚刚发现,这意味着自动使浏览器全屏幕......嗯不完全实际。我觉得iPhone有一个全屏的网络应用程序的东西http://ajaxian.com/archives/iphone-full-screen-webapps,但Andriod –

-1

编辑

新的答案

很多人改变,因为这个问题被问。现在有很好的原生支持滚动,固定位置,并且大多数操作系统的浏览器栏比当时小得多。由于这种情况,我建议不要诉诸滚动黑客大多数站点和答案的建议。坚持操作系统的规则将提高您的web应用程序的稳定性,可用性和未来兼容性。

老答案

这有可能为iPhone时,有人将其保存为一个Web应用程序的主屏幕。如果您添加适当的元标记,这将起作用。

对于标准browsermode这是一个有点棘手,你必须退回到黑客。基本上,地址栏在滚动时会消失(对于Iphone和大部分Android版本)。你可以用javascript来伪造这个。移动内容也有一个很好的文章: http://mobile.tutsplus.com/tutorials/mobile-web-apps/remove-address-bar/,但这只适用于内容的屏幕分辨率更长。

0

你可以使用这个应用程序为Android:Kiosk Web/Html Browser,它创建一个文件夹在你的SD卡,你可以把HTML,以全屏幕“沉浸模式”显示。

相关问题