JQuery mobileでPhonegap(Cordova)アプリをつくる

Dec 18, 2014  

cordova4.1.2で動作確認しております。

基本的には普通にJQuery mobile使って書くだけなんですが、
そのままだと、iOS7.0以降の上部のステータスバー的なものと
JQuery mobileのヘッダが重なってしまいます。

そのため、iOS7.0以降でのみヘッダの上にマージンをが設定されるようにします。
.css()とかでやってもpage遷移後に機能しなかったので、
style要素を動的に追加する方法にしたらうまくいきました。

まずwindow.deviceを使うためにpluginを追加します。
$ cordova plugin add org.apache.cordova.device

ソースは以下の通り。

このエントリーをはてなブックマークに追加