Creating a Popup Widget in jQuery Mobile 1.2.0 is now easier than ever. To create a popup, just add the data-role="popup"
attribute to the popup contents, typically a DIV element. When invoking the Popup Widget from a link, an A tag, add the attribute data-rel="popup"
to tell the jQuery Mobile to open the popup when the link is tapped. Make sure that you set the href
to the id
of the popup div. See the example below:
1 2 3 4 5 6 7 | <!-- link to invoke the popup widget --> <a href="#my-popup" data-rel="popup">Open Popup</a> <!-- basic popup widget with no options set --> <div data-role="popup" id="my-popup"> <p>Popup widgets... really easy.<p> </div> |
<!-- link to invoke the popup widget --> <a href="#my-popup" data-rel="popup">Open Popup</a> <!-- basic popup widget with no options set --> <div data-role="popup" id="my-popup"> <p>Popup widgets... really easy.<p> </div>
Some of the options that you can setup for the jQuery Mobile Popup are:
Create, customize, and publish mobile web applications using the Appcropolis Mobile Builder.
Get StartedWe offer 1,000's of mobile templates that are fully designed, coded, and ready to use. Learn more.
Download Free Templates
Not registered? Create an Account.
Lost your password? Click here to recover.