2013-03-20 79 views
4

我遇到以下問題:以全屏模式啓動移動Web應用程序

我使用jQuery Mobile 1.2創建了一個web應用程序。現在我要開始這個程序在全屏模式下沒有地址欄,工具欄等 我已經在網上搜索和發現,也有一些meta標籤,使該模式:

<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下會被忽略。 我認爲框架應該自動切換模式,但它不起作用。是否有一個特殊的全局變量,我必須操作或框架函數調用或腳本片段包括?

在此先感謝!

+0

'viewport'不是iOS的具體,但..和我猜這裏..該'蘋果'是.. * Apple *特定。您可能不會讓每個瀏覽器都以相同的方式運行。事實上,我會爲我的瀏覽器感到不安,因爲它允許你的網站隱藏地址欄 – Eonasdan 2013-03-20 20:19:02

回答

1

您可以使用Javascript代碼隱藏地址欄在android系統:

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

在iPhone上,打開Safari瀏覽器網頁。 接下來,點擊分享按鈕(底部欄中間的那個)。

然後,點擊「在主屏幕上」按鈕。 它會在您的主屏幕上創建一個書籤。

你只需要啓動它,並且你有你的web應用程序。

不要忘記添加您在問題中提到的代碼。

+0

我知道如何將我的應用程序添加到主屏幕,但這隻能在iPhone上進行。擁有適用於iOS,Android或Windows Phone的獨立於平臺的解決方案將是一件好事。 – altralaser 2013-03-21 21:04:18

0

我能得到這個關於Chrome瀏覽器的Android:

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