Trying to get a jQueryMobile Dialog to open up upon the clicking of an option in a PhotoSwipe footer.
I'm using the following code:
options = {
enableMouseWheel: true,
enableKeyboard: true,
getToolbar: function(){
return '<div class="ps-toolbar-close" style="padding-top: 12px;">Close</div><div class="ps-toolbar-play" style="padding-top: 12px;">Play</div><div class="ps-toolbar-previous" style="padding-top: 12px;">Previous</div><div class="ps-toolbar-next" style="padding-top: 12px;">Next</div><a onclick="" href="pages.aspx" data-role="button" data-icon="grid" data-transition="slidedown" data-iconpos="bottom">Pages</a>';
}
};
myPhotoSwipe = $("#Gallery a").photoSwipe(options);
But when I click "Pages", nothing happens, Firebug is reporting that it's loading the page via JSON and not actually rendering it.
Any ideas on how to resolve this?
My guess is that it's being loaded underneath the Photoswipe modal. If you inspect the Photoswipe modal you'll probably see that it's z-index is set super high (500+). The jQuery Mobile dialog would have to have a higher z-index than Photoswipe for you to see it.