Question

我遇到以下问题：

我使用jQuery Mobile 1.2创建了一个webapp。现在我想在没有地址栏，工具栏等的全屏模式下启动这个应用程序。我已经在网上搜索并发现有一些元标记可以启用此模式：

<meta name="viewport" content="width=device-width, initial-scale=1" />
<meta name="apple-mobile-web-app-capable" content="yes" />
<meta name="apple-mobile-web-app-status-bar-style" content="black" />

到目前为止这是正确的。但我也读到这些标签是iOS特定的，在Android下会被忽略。我认为框架应该自动切换模式，但它不起作用。是否有一个特殊的全局变量，我必须操作或调用框架函数或要包含的脚本片段？

提前致谢！

Answer 1

你可以使用这个javascript来隐藏android中的地址栏：

if(navigator.userAgent.match(/Android/i)){
    window.scrollTo(0,1);
}

Answer 2

在iPhone上，使用Safari打开您的网页。接下来，单击共享按钮（底部栏中间的那个）。

然后，点击“在主屏幕上”按钮。它会在主屏幕上创建一个书签。

你必须启动它，然后你就拥有了你的webapp。

不要忘记添加您在问题中提到的代码。

Answer 3

我能够使用chrome for android：

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

以全屏模式启动移动webapp

3 个答案: