FC2ブログ

jQuery Mobile の解説

jQuery Mobile の基本的なUIは
ヘッダーとフッター

jQuery Mobile では
page という概念があり、

1つのページに
ヘッダー
コンテンツ
フッター

という構成になります
ページは紙面 data-role=”page”
ヘッダーは見だし data-role=”header”
コンテンツは記事 data-role=”content”
フッターは下の見だし data-role=”footer”

みたいなかんじです

なお page には id をつける必要があります

id は、重複するのはダメなので、被らないように注意が必要です

ソースをちょっと解説用にしてみました


<div id="ページのID" data-role="page">
<div data-role="header">
<h1>見だし</h1></div> <!-- /header -->
<div data-role="content">
内容</div> <!-- /content -->
<div data-role="footer">
<h2>下のみだし</h2></div> <!-- /footer -->
</div> <!-- pageの閉じタグ -->
~
フッターには
広告とかのほかに、
戻るボタンとかなどを配置したりします

ちなみに、よくあるスクロールしても
一番下にずっと広告がでるのは、たぶん、フッターに
data-position="fixed"
がついているからです

ソースにすると
<div data-role="footer" data-position="fixed">
広告じゃなくて、ボタンとかを配置して、常時操作するようにもできます
スポンサーサイト



テーマ : プログラミング
ジャンル : コンピュータ

trackback


この記事にトラックバックする(FC2ブログユーザー)

まとめtyaiました【jQuery Mobile の解説】

jQuery Mobile の基本的なUIは ヘッダーとフッター jQuery Mobile では page という概念があり、 1つのページに ヘッダー コンテンツ フッター という構成になります ページは紙面 data-role=”page” ヘッダーは見だし data-role=”header” コンテンツは記事 data-r...

コメント

非公開コメント

最新記事
検索フォーム
GREEハコニワ攻略サイト
リンク
カテゴリ
月別アーカイブ
フリーエリア
最新記事
FXプライムレート
最新コメント
最新トラックバック