2011年1月4日火曜日

jQuery Mobile その2(リンクのさせ方)

jQuery MobileでのリンクのデフォルトはAjaxで処理をするようになっている。

1)ページ内リンク
リンク先にID指定すると、ページ内にdata-role="page"で定義されているコンテンツに切り替えて表示をしてくれる。

指定例)
 <a href="#hoge">リンク</a>

2)ページ外リンク(Ajax)

リンク先に外部コンテンツを指定すると、表示をアニメーション付で切り替えて表示をしてくれる。
ただし、Ajaxで読みこむため、URLが
   http://ドメイン/呼びもと.html#hoge.html
となり、少し使いづらい。ベースとなるURLが呼びもとのHTMLとなるため、画像のリンク切れとか。

指定例)
<a href="hoge.html">リンク</a>

3)ページ外リンク(Non Ajax)
Ajax抜きで通常のリンク処理のように画面全体をリフレッシュしたい場合は、
「rel="external"」 をタグの属性として指定する。
指定例)
<a rel="external" href="hoge.html">リンク</a>



0 件のコメント: