2013年6月4日火曜日

jQuery Mobile 1.3.1にバージョンアップしてみた。

オフィス狛 技術部です。

旧バージョンのjQuery Mobileで作成したサイトをリニューアルする事になり、
ついでに、jQuery Mobile のバージョンアップしてみました。

正しく動作するまで苦労したので、対応内容をメモしておきます。

まず分かり易く動作しなかったのが、以下の二つ。

  1. ページ遷移のアニメショーンが効かない。
  2. 遷移後の画面で「戻る」ボタンが表示されない。


それぞれの対応内容を記載します。

1.ページ遷移のアニメショーンが効かない。


旧バージョンでは、以下のように記載していました。
$(document).bind("mobileinit", function(){
    $.mobile.defaultTransition = "slide";
});

新しいバージョンでは、defaultTransitionは無視されてしまうようです。
( defaultPageTransition と defaultDialogTransition が追加されている)
実害が無いのであればこのままでもいいのですが、
折角jQuery Mobileを利用しているのに、
アニメーションが出来ないのは意味が無いので、以下のように修正しました。
$(document).bind("mobileinit", function(){
    $.mobile.defaultPageTransition = "slide";
});

2.遷移後の画面で「戻る」ボタンが表示されない。


旧バージョンでは勝手に作成された「戻る」ボタンが、新バージョンになるとデフォルトでは作成されないようです。
以下のように明示的に指定するように修正しました。
$(document).bind("mobileinit", function(){
    $.mobile.page.prototype.options.addBackBtn = true;
});

とりあえず、正しく動くようになりました。
また何かあれば、記載しようと思います。

※対応は下記の記事を参考にさせて頂きました。

jQuery Mobile Beta1へのアップデートについてまとめたメモ


0 件のコメント:

コメントを投稿