以jQuery模态对话框弹出为中心

时间:2013-10-07 07:51:59

标签: jquery css jquery-ui modal-dialog jquery-ui-dialog

我试图在用户访问我的主页时显示模式对话框/弹出窗口。

我可以显示对话框,但它不会出现在屏幕中央。

我正在导入这些文件,以防出现问题:

<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" />
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>

<script language="JavaScript" type="text/javascript"> 
$(function () { 
    $("#dialog-modal").dialog({ 
    width: 'auto',
    // position: 'center',
    center: true, 
    modal: true, 
    autoOption: true, 
    resizable: false 
    }); 
}); 
</script>

<div id="dialog-modal" title="Offer" style="text-align:center"><img alt="" src="Pack.jpg"/> </div>

我的小提琴:http://jsfiddle.net/szEpb/

由于

1 个答案:

答案 0 :(得分:0)

尝试取消注释// position: 'center',

或者如果它不起作用请尝试以下代码。希望这就是你的意思.. :))

$('body').dialog('option', 'position', 'center');

如果您需要以特定选择器为中心,请尝试

$('your_selector').dialog('option', 'position', 'center');