jQuery Mobileで構築メモ

jQuery Mobileは、わずかなHTMLやJavaScriptの記述でスマートフォンに最適化したサイトデザインの制作を可能とするフレームワークの一つで(日本語リファレンス)、対応するデバイスやユーザーインターフェイス部品の幅が広いので最も多く使われている。その使用方法については、「...入門」を参照。
今回は手っ取り早く、Template-Party から入手したテンプレートを借用して自前のサイトを試作してみた。
<方法>tp_fudosan4_brownをダウンロードして解凍、spjフォルダがスマホ用HPテンプレートで、トップページには外部ファイルにリンクする index.htmlを使用した(index_all.html方式は、複数の主要コーナーを有する当サイトでは反って使い辛い)。
body bgcolor="#FAF5F5"として、リンクに data-transition="slide"等を取り入れ、jQuery Mobilをv.1.1.0から v.1.2.0へ変更してその関連ファイルを自前のサイトに配置して使用したが、style.css構文は変更する事なく構築した。
なお、 Googleマップの表示ページでは、[戻る]ボタンが有効だと地図の描画が出来ない為、リンクを_self等へ、[戻る]をリンクにしたら成功した ヽ(^o^;)ノ
<成績>画像挿入のレイアウトが今一だが、標準的な相応の出来栄えだ。
Opera Mobile(12.1)は、jQuery Mobile 1.1.0では 毎回更新しないと表示出来ない不具合があったが、v.1.2.0にアップしたら解消した ヽ(^o^;)ノ
Ken のムービー計画(jQuery M版)