jQUery Mobile popups

by katalin_2003

HTML

<link rel="stylesheet" href="http://code.jquery.com/mobile/1.4.0/jquery.mobile-1.4.0.min.css">
<script src="http://code.jquery.com/mobile/1.4.0/jquery.mobile-1.4.0.min.js"></script>
<!--<a href="#positionWindow" class="ui-btn ui-corner-all ui-shadow ui-btn-inline" data-rel="popup" data-position-to="window">Position to window</a>
<a href="#positionOrigin" class="ui-btn ui-corner-all ui-shadow ui-btn-inline" data-rel="popup" data-position-to="origin">Position to origin</a>
<a href="#positionSelector" class="ui-btn ui-corner-all ui-shadow ui-btn-inline" data-rel="popup" data-position-to="#position-header">Position to #position-header</a>-->
<div data-role="popup" id="positionWindow" class="ui-content" data-theme="b" data-overlay-theme="a">
<p style="padding: 30px; background-color: #2A2A2A; color: white; font-size: 300%;">OK</p>
</div>
<div data-role="popup" id="positionOrigin" class="ui-content" data-theme="a">
<p>I am positioned over the origin.</p>
</div>
<div data-role="popup" id="positionSelector" class="ui-content" data-theme="a">
<p>I am positioned over the header for this section via a selector. If the header isn't scrolled into view, collision detection will place the popup so it's in view.</p>
</div>

JavaScript

$(document).ready( function() {
    setTimeout(function() {
        $("#positionWindow").popup("open");
    }, 100);
});
//$("#positionWindow", $(this)).popup("open");