CODEWITHSUNDEEP
jqueryjquery-mobile
cusejuice
cusejuice

Reputation: 10681

jQuery Mobile close dialog and load a different page

In jQuery mobile, is it possible when a user opens a new page (lets say example.html), to

I've setup the dialog but not sure what to do to fade in/fade out the dialog box.

<div data-role="page">
// page
</div>

<div data-role="dialog">
  // dialog box fades in, 3 seconds later, fade out
</div>

Upvotes: 0

Views: 512

Answers (2)

hgross
hgross

Reputation: 690

Annotate the page and the dialog with a unique id and bind something like this to the pageshow event of the page:

jQuery('#myPageId').bind('pageshow', function() {
    var me = jQuery(this);
    var dialogShown = me.data('dialogShown');
    var dialog = jQuery('#myDialogId');
    if(!dialogShown) {
        me.data('dialogShown', true);
        dialog.one('pageshow', function() {
            setTimeout(function() { window.history.back(); }, '3000');
        });
        jQuery.mobile.changePage(dialog, {transition: 'fade'}); 
    }
});

Upvotes: 1

lamelas
lamelas

Reputation: 872

Use the fadeOut method and you should be able to fade the dialog. Then set a timer to call that 3 seconds after the page has loaded.

Upvotes: 0

Related Questions