我一直在努力使弹出窗口在JQM中全屏显示但无法做到
这是一个fiddle
代码是这样的
HTML
- <div data-role="page" id=""> <a href="#sql" id="opendialog" data-rel="popup" class="ui-btn ui-corner-all ui-shadow ui-btn-inline" data-transition="pop">Open Dialog</a>
- <div data-role="popup" id="sql" data-dismissible="false" style="max-width:100%">
- <div data-role="header" data-theme="a">
- <h1>Delete Page?</h1>
- </div>
- <div role="main" class="ui-content">
- <h3 class="ui-title">Are you sure you want to delete this page?</h3>
- <p>This action cannot be undone.</p> <a href="#" class="ui-btn ui-corner-all ui-shadow ui-btn-inline ui-btn-b" data-rel="back">Cancel</a>
- <a href="#" class="ui-btn ui-corner-all ui-shadow ui-btn-inline ui-btn-b" data-rel="back" data-transition="flow">Delete</a>
- </div>
- </div>
- </div>
谢谢&问候
解决方法
> CSS解决方案：
这将适用于任何弹出窗口.
- .ui-popup-container,.ui-popup {
- height: 98%;
- width: 100%;
- position: absolute;
- top: 0;
- left:0;
- }
> JS解决方案：
定位特定弹出窗口.
- $(document).on("pagecreate","#pageID",function () {
- $("#sql").popup({
- beforeposition: function () {
- $(this).css({
- width: window.innerWidth,height: window.innerHeight - 14
- });
- },x: 0,y: 0
- });
- });
07000
