私は現在、jQuery Mobile (http://jquerymobile.com/) とフォト ギャラリー用の Photoswipe (http://www.photoswipe.com/) を使用するクライアントのモバイル サイトに取り組んでいます。
現在解決しようとしている現在の問題は次のとおりです。
- フォトギャラリーページへ
- 「戻る」ボタンまたはロゴをクリックしてホームページに戻ります
- 最初の 3 つのナビゲーション ボタン (モバイル サイト内の内部「ページ」(div) へのリンク) のいずれかをクリックしてみてください。何も起こりません。アドレス バーで URL が更新されていることがわかりますが、コンテンツは実際には変更されていないため、これらのナビゲーション ボタンは本質的にデッド リンクです。
これまでのところ、iPhone デバイスでこの問題が発生しており、Safari でも問題を再現できます。私はこれについて何時間も頭を悩ませてきましたが、この問題の原因を突き止めることはできません.
ここでライブ URL を確認できます: http://cms.vizergy.com/vsites/Preview.aspx?siteguid=af91c21b-1717-4e57-935c-a617fed2303b
Photoswipe をページに添付するコードは次のとおりです。
/*
* IMPORTANT!!!
* REMEMBER TO ADD rel="external" to your anchor tags.
* If you don't this will mess with how jQuery Mobile works
*/
(function(window, $, PhotoSwipe){
var options = {jQueryMobile: false};
$(document).ready(function(){
/* var activePage = $('.ui-page-active'); */
var activePage = $('.ui-page-active');
if($(".ui-page-active").is(".pGalOn")) {
photoSwipeInstance = $("ul.pGal a", activePage).photoSwipe(options, activePage.attr('id'));
}
$('div.pGalOn')
.live('pageshow', function(e){
var
currentPage = $(e.target),
photoSwipeInstance = $("ul.pGal a", e.target).photoSwipe(options, currentPage.attr('id'));
return true;
})
.live('pagehide', function(e){
var
currentPage = $(e.target),
photoSwipeInstance = PhotoSwipe.getInstance(currentPage.attr('id'));
if (typeof photoSwipeInstance != "undefined" && photoSwipeInstance != null) {
Code.PhotoSwipe.detatch(photoSwipeInstance);
}
return true;
});
});
}(window, window.jQuery, window.Code.PhotoSwipe));
どんな助け/洞察もいただければ幸いです!
編集:
Photoswipe のコードに欠陥があることを発見した優秀な開発者の同僚に助けてもらいました。「windowsHashChangeHandler」がnullの場合、「hashChange」イベントからすべてのイベントハンドラーを削除して、戻るボタンを役に立たなくするという行があるようです。基本的に、photoswipe.js ファイルの以下をこれから変更します。
if (this.isBackEventSupported && this.settings.backButtonHideEnabled){ Util.Events.remove(window, 'hashchange', this.windowHashChangeHandler);
}
これに:
if (this.isBackEventSupported && this.settings.backButtonHideEnabled && this.windowHashChangeHandler !== null){
Util.Events.remove(window, 'hashchange', this.windowHashChangeHandler);
}
詳細はこちら: https://github.com/codecomputerlove/PhotoSwipe/pull/351