Create a form first
<div data-role= "Popup" id= "Popupview" class= "ui-content" data-overlay-theme= "B" data-position-to= "window" Data-dismissible= "false" >
<a href= ' javascript:void (0) ' data-rel= ' Back ' class= ' ui-btn ui-corner-all Ui-shadow ui-btn-a ui-icon-delete ui-btn-icon-notext ui-btn-right ">Close</a>
<div> Popup content <div >
</div>
1) Click to eject
2 after the page is loaded, eject
Page delay Load <script>
settimeout (function () {
$ ("#popupView"). Popup (' open ');
Keyword Description:
Data-overlay-theme: Background color transparent gray data-position-to: The pop-up window is centered in the Windows data-dismissible: Do you want to allow you to close the window at any point outside the window (default true is allowed) Data-transition: Pop-up mode
The following is a detailed example of the jquery mobile pop-up layer using a code instance
Introducing Files
Pop-up Layer Basics
Create a pop-up layer, add a data-role= "popup" attribute to the div tag, add a tag of a, and set the pop-up div layer ID in the a label href attribute to add a property to the a tag
Data-rel= "Popup"
to create a popup, add the Data-role= "popup" attributes to a div with the popup contents. Then Create a link with the href set to the ID of the popup div, and add the attribute data-rel= "popup" to tell the Framew Ork to open the popup when the link is tapped. A Popup div has to be nested inside the same page as the link.
<a href= "#popupBasic" Data-rel= "popup" class= "ui-btn ui-corner-all ui-shadow ui-btn-inline" data-transition= "Pop" >basic popup</a>
<div data-role= "Popup" id= "Popupbasic" >
<p>this is a completely Basic Popup, no options set.</p>
</div>
Simple example
A tooltip can create a sample by adding a theme and basically pop through the ui-content and add a fill
A tooltip can is created by adding a theme swatch to a basic popup and adding via the padding class.
<p>a paragraph with A tooltip. <a href= "#popupInfo" data-rel= "popup" "data-transition=" Pop "class=" My-tooltip-btn ui-btn Ui-nodisc-icon ui-btn-inline ui-icon-info ui-btn-icon-notext "title=" Learn more ">learn more</a></p>
<div data-role= "popup" id= "Popupinfo" class= "Ui-content" Data-theme= "a" style= "max-width:350px"; >
<p>here is a <strong>tiny popup</strong> being used like a tooltip. The text would wrap to multiple lines as needed.</p>
</div>
Hint Information instance
pop-up picture