web-dev-qa-db-ja.com

Androidのメタタグ「Apple-mobile-web-app-capable」？

IPhoneのようにAndroid Webアプリケーションを作成する方法はありますか？

HTMLページのhead要素で「Apple-mobile-web-app-capable」メタタグを使用して、Apple iOSにアプリケーションをユーザーのスプリングボードにインストールできることを通知します。メニューバーなしでSafariモバイルブラウザを起動します。

androidhtmlweb-applicationsmeta-tagsmobile-webkit
27
Zymotik

Chrome Androidがメタタグをサポートするようになりました mobile-web-app-capable ：

Chrome M31であるため、アプリケーションのショートカットアイコンをデバイスのホーム画面に追加し、Chrome。

mobile-web-app-capableメタタグの詳細については、「M39より前のホーム画面にインストールされたアプリのサポート」までスクロールしてください。

M31以降、ChromeはWebページの要素で次のメタタグを探します（表示が指定されたマニフェストがある場合、これは無視されます）：

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

Name属性は「mobile-web-app-capable」である必要があり、content属性は「yes」である必要があります（大文字と小文字は区別されません）。 content属性に他の値がある場合、Webアプリは通常のブックマークとして追加されます。

私がテストできるChrome M31を実行しているデバイスはありませんが、デバイスのホームスクリーンにアイコンが付いたフルスクリーンWebアプリがサポートされていることを意味すると解釈します戻るChrome M31、ただしmobile-web-app-capableメタタグを使用する場合。

21
Josh

Chrome31以降のホーム画面のウェブアプリはAndroidでもサポートされています。 こちら を参照してください。

3
Ludis studio

私はそうは思いません。

ただし、ブラウザがAndroidデバイスであるかどうかを検出し、Android Marketへのリンクを表示することは、アプリ（または直接APKに）

AndroidにはWebViewウィジェットがあるため、専用のWebサイトをロードする、または何らかの方法でオフラインコンテンツをラップするアプリを作成するのは簡単です（初回起動時にダウンロードされるか、アセットフォルダーで出荷されます）。

2
Phil Lello

JQueryを使用して、コンテンツの高さがビューポートの高さより大きいかどうかを確認できます。そうでない場合は、その高さにすることができます。

$(document).ready(function() { 
  if (navigator.userAgent.match(/Android/i)) { 
    window.scrollTo(0,0); // reset in case prev not scrolled   
    var nPageH = $(document).height(); 
    var nViewH = window.outerHeight; 
    if (nViewH > nPageH) { 
      nViewH -= 250; 
      $('BODY').css('height',nViewH + 'px'); 
    } 
    window.scrollTo(0,1); 
  } 

});

Meagarへのクレジット： ブラウザからアドレスバーを削除（Androidで表示するため）

1
Zymotik

ホームスクリーン上にブックマーク（=任意のWebページ）へのショートカットを作成できます。

0
molnarm