iOS

【iOS】Webページをスタンドアローンモードで起動している際のステータスバーのデザインを変更する。

メモ。

iOS7はスタンドアローンモードでWebページを起動すると、ステータスバーが真っ黒になってしまい、インジゲーター類がすべて非表示になってしまう問題?がある。
これを解決するためには下記のmetaタグをhead要素内に追加してやる必要がある。

<meta name="apple-mobile-web-app-status-bar-style" content="black" />

このプロパティはステータスバーのデザイン変更するために用意されているもので、contentの部分に指定する値を変更すればデザインが変更される。

今回はblackを指定することでインジゲーターの表示を復活させているが、指定できる値は「default」、「 black」、「black-translucent」の3つがある。

 

【iOS】モバイルサファリのホームスクリーン追加機能を使用した際に、ページの挙動をスタンドアローンモードにする。

メモ。

head要素内に下記のmetaタグを追加すれば良い。

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

このモードを利用する際は、サイト内移動をjavascriptでの繊維にしないとリンクをクリックした際にsafariが起動してしまう可能性があるので注意が必要。