2011
9月
18
(日)
jQuery mobile でのハッシュによるアンカー付きリンク [6]
携帯対応レンダラーで使用している jQuery mobile ですが、URLハッシュ値によるページ内アンカーや他ページからのアンカー付きリンクが多い XOOPS[10] では、Ajax によるページ変遷を下記の設定で無効にしています。
1
2
3
4
5
6
7
|
-
|
|
|
|
!
| jQuery.noConflict();
jQuery(document).bind("mobileinit", function(){
jQuery.mobile.ajaxEnabled = false;
jQuery.mobile.ajaxLinksEnabled = false;
jQuery.mobile.ajaxFormsEnabled = false;
jQuery.mobile.hashListeningEnabled = false;
});
|
ページ内アンカーリンクについては問題ないのですが、他ページからのアンカー付きリンクでアクセスすると、一旦該当のアンカーに画面移動してからページ読み込み完了後にページトップに戻ってしまう(ロケーションバーを隠すための jQuery mobile の機能)ので、とても使いづらいです。
そこで、ちょっと jquery.mobile.min.js をいじって、アンカー付きリンクの場合はページトップに移動しないようにしてみました。
これで、今のところ快適に動作しています。
と思ったけど、上手く動作してなかった。
再考するした。
- jQuery mobile 1.0 beta 3
- Before
1780
1781
1782
1783
| -
-
|
!
| silentScroll: function( ypos ) {
if ( $.type( ypos ) !== "number" ) {
ypos = $.mobile.defaultHomeScroll;
}
|
- After
1780
1781
1782
1783
1784
1785
1786
1787
| -
-
-
|
-
|
!
!
| silentScroll: function( ypos ) {
if ( $.type( ypos ) !== "number" ) {
if (!$.mobile.hashListeningEnabled && location.hash) {
ypos = $(location.hash).offset().top;
} else {
ypos = $.mobile.defaultHomeScroll;
}
}
|
- この改造を反映した jquery.mobile.min.js (1.0 beta 3)