Fred Thomas
Fred Thomas

Reputation: 944

jQuery mobile and pop up dialog boxes

I need a pop up dialog box for my jQuery mobile app. I found this plug in:

http://dev.jtsage.com/jQM-SimpleDialog/

Which is awesome -- doing exactly what I need, but for one detail -- it doesn't work correctly on the Android browsers I tried it on (all I get is a blank screen.) I suspect that the developer only tested on iPhone (perhaps an iPhone user could confirm if it works or not.)

Does anyone know of either a fix, or an alternative plug in that does the same sort of thing?

Upvotes: 8

Views: 21321

Answers (2)

Șerban Ghiță
Șerban Ghiță

Reputation: 1967

I'm having the same problem and I decided to use popup() function from jQuery Mobile 1.2 alpha: http://jquerymobile.com/demos/1.2.0-alpha.1/docs/pages/popup/index.html. Before this I used JQM Simple Dialog 2 http://dev.jtsage.com/jQM-SimpleDialog/demos2/.

This might help also:

I've also created a small plugin which wraps around jQuery Mobile popup() function to be able to call the popup much easier like $.dynamic_popup('Your HTML message'); See http://ghita.org/jquery/dynamic-mobile-popup or the demo and screenshots at https://github.com/serbanghita/jQM-dynamic-popup

Let me know if you find it useful.

PS: works with jQM 1.3

Upvotes: 0

Patrick Moore
Patrick Moore

Reputation: 13354

If you are simply displaying information (no need for callback/response events) you can create a popup in this manner:

<script type="text/javascript">
$("<div class='ui-loader ui-overlay-shadow ui-body-e ui-corner-all'><h1><strong>Thank you, we have received your information.</strong></h1></div>")
    .css({ "display":"block", "opacity":0.96, "top": $(window).scrollTop() + 100 })
    .appendTo( $("body") )
    .delay( 2500 )
    .fadeOut( 400, function(){
        $(this).remove();
    });
</script>

Upvotes: 5

Related Questions