JQuery ui,对话框无法居中

2023年8月15日 171次阅读

有人可以帮助我,告诉我为什么我不能集中
JQuery UI对话框

    
    POS
    

<script src="js/jquery-1.7.1.js"></script>
<script src="js/jquery.ui.core.js"></script>
<script src="js/jquery.ui.widget.js"></script>
<script src="js/jquery.ui.button.js"></script>
<script src="js/jquery.ui.mouse.js"></script>
<script src="js/jquery.ui.resizable.js"></script>
<script src="js/jquery.ui.dialog.min.js"></script>
<style type="text/css" title="currentStyle">
</style>
<style> 
    </style>

<script>
$(function() {
    $('#addDialog').dialog({modal:true,buttons: {
            "Delete all items": function() {
                $( this ).dialog( "close" );
            },
            Cancel: function() {
                $( this ).dialog( "close" );
            }
        },position: 'center'});

    $("#resizable").resizable({
        animate: true,
        maxWidth: 400,
        minWidth: 300,
        containment: ".fullscreen"
    });

});
</script>

  </head>
 <div id='addDialog' style="display: none;">
iohio
 </div>
 <body id="dt_example" style='overflow:hidden;'>


 <div class="fullscreen" style='overflow:hidden;'>

 <div style='float: left; height:90%;' id="resizable" >


 </div>

 <div id="resizable2"  style='height:90%; overflow:hidden;'>

 <div id="container">

 <div id="demo">

 </div>

</div>

</div>

</div>
</body>
</html>

最佳答案 编辑：

看起来您还应该在此对话框文档中添加对UI位置的引用：http://jqueryui.com/demos/dialog/

此外,为了防止将来出现这种情况,请在此处构建下载：http://jqueryui.com/download,以便为所需功能自动下载所有依赖项.

在你的< body>中移动你的addDialog div标签

这个…

<div id='addDialog' style="display: none;">
    iohio
</div>
<body id="dt_example" style='overflow:hidden;'>

应该

<body id="dt_example" style='overflow:hidden;'>
  <div id='addDialog' style="display: none;">
     iohio
  </div>
点赞