2012-07-01 14 views
10

モバイルデバイス用のHTML5 Webアプリケーションを作成していて、ブラウザのナビゲーションバー(背面の&の順ボタン)(ここではtypo)を非表示にしています。それをどうすれば実現できますか?HTML5フルスクリーンWebアプリケーション:ブラウザバーなし

私はPhone Gapを使ってそれを達成できるはずだと思います。しかし、私はブラウザバーを隠すために "通常の"ウェブアプリの可能性があるのだろうか?私はホームスクリーンにウェブサイト/アプリをピン止めすれば可能だと思いますか?

iPhoneはhttp://ajaxian.com/archives/iphone-full-screen-webappsですが、少なくともAndriodはどうですか?

+0

あなたのアプリにJQueryを適用することはできますか? – Asif

答えて

8

ので、ここでは、この時点での日付のうちビットが更新されているが

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

最小限のui属性は、ブラウザがすべてのボタンを非表示にしながら、タスクバーをそのままにします。

私はアンドロイドのためにこれをテストしていません。

7

ウェブアプリでJQueryを使用できる場合は、NiceScrollプラグインをお勧めします。

モバイルブラウザとデスクトップブラウザの両方に使用でき、ブラウザのスクロールバーを非表示にします。コードがブラウザのビューポートの高さを超えている場合、カスタムスクロールバーが作成され、使用されていない場合はフェードアウトされます。

ここはits Demoです。

編集:あなたの更新を1として
、私は私が実際にネイティブモバイルWebアプリの開発者はないですが、あなたの問題を探している間、私はあなたがリードして助けることができるいくつかのSOの質問を見つけたことを追加したいと思いますさらなる方法:

そして、これらのチュートリアルS:

+0

Ops、私の悪い、私はブラウザバーを意味します。戻る&進むボタン付きのもの –

+1

"_Automatic F11 Script_"のようなものを取っていますか? – Asif

+0

ああ、私はそれが自動的にブラウザをフルスクリーンにすることを意味していることを知りました。私はiPhoneはフルスクリーンのWebアプリケーションのものを持っていると思うが、Andriodについては –

-1

EDIT

新しい答え

多くは、この質問を頼まれたので、変更されています。スクロールと固定位置のネイティブサポートがあり、ほとんどのOSのブラウザバーは当時ははるかに小さくなっています。これが当てはまるので、ほとんどのサイトと回答が推奨するように、スクロールハッキングに頼らないようアドバイスします。 OSのルールに従うことで、ウェブアプリケーションの安定性、ユーザビリティ、将来の互換性が向上します。

旧答え

誰かがホームスクリーンへのWebアプリケーションとして保存するとき、それはiPhoneのために可能です。これは、適切なメタタグを追加すると機能します。それはあなたがハックにフォールバックする必要が少しトリッキーだ標準browsermodeについては

。基本的にアドレスバーはスクロールすると消えます(iPhoneとAndroidのほとんどの時間)。あなたはjavascriptでこれを偽造することができます。モバイルチュートリアルにも良い記事があります: http://mobile.tutsplus.com/tutorials/mobile-web-apps/remove-address-bar/ですが、コンテンツが画面解像度より長い場合にのみ動作します。

0

このアプリケーションをAndroid用に使用することができます:Kiosk Web/Html Browser、それはフルスクリーン「没入型モード」で示されたhtmlを置くことができるフォルダをsdカードに作成します。

関連する問題