PoC : iOS Safari Web

iOS Safari で使える HTML・CSS・JS を検証する。

apple-mobile-web-app-capable

「ホームに追加」した時にフルスクリーンモードで起動できるようになる meta name="apple-mobile-web-app-capable" の検証。

apple-mobile-web-app-capable・apple-mobile-web-app-status-bar-style : default

meta name="apple-mobile-web-app-status-bar-style" の検証その1。

apple-mobile-web-app-capable・apple-mobile-web-app-status-bar-style : black

meta name="apple-mobile-web-app-status-bar-style" の検証その2。

apple-mobile-web-app-capable・apple-mobile-web-app-status-bar-style : black-translucent

meta name="apple-mobile-web-app-status-bar-style" の検証その3。

apple-mobile-web-app-title

meta name="apple-mobile-web-app-title" で「ホームに追加」した時のアプリ名を指定できる。

JS API Access

JS でアクセスできる各種 API を確認する。

Apple System Font

iOS9 以降の新システムフォント San Francisco を CSS で指定できる -apple-system の検証。

Always Show Bottom MenuBar

iOS Safari の画面下部のメニューバーを、スクロールしても常に表示したままにする。

3D Touch

iPhone 6s 以降で使えるようになった 3D タッチ (Force Touch) の検証。

TouchStart Hover

CSS の :hover:focus を有効にする方法の検証。

Notch CSS

CSS で iPhoneX 的なノッチを再現する。

Links