Create a fullscreen mobile popup

Asked Jul 08 '13 at 13:51

Active Sep 12 '13 at 15:49

Viewed 1,606 times

I am trying to achieve a full screen popup with a close button. 1) I have tried this

<div data-role="popup"  id="popupid" data-overlay-theme="a" data-theme="c"  class="ui-corner-all">
    <div data-role="page" data-fullscreen="true">
        <p>This is a completely basic popup, no options set.<p>
    </div>
</div>

The problem is page doesn't showup

2) I have tried setting popup height to 100% and width to 100% , it doesnt help

The desired result is http://dl.dropboxusercontent.com/u/174493814/OverlayPopupDialog.png

Any tips ? Should I need to use Jquery Dialog to achieve the desired result ? Thanks!

edited Sep 12 '13 at 15:49

Serge P

1,173
3
25
39

asked Jul 08 '13 at 13:51

Pavan Garre

2,661
1
18
19

Use `absolute` positioned `div` with height and width of the screen. – David Jashi Jul 08 '13 at 13:54
Jquery Mobile Plugin wouldn't help? – Pavan Garre Jul 08 '13 at 14:03
Well, it's another way of doing this, if you prefer. – David Jashi Jul 08 '13 at 14:57

Create a fullscreen mobile popup

0 Answers0