Javascript 对中jqueryui对话框_Javascript_Jquery_Css_Jquery Ui

Javascript 对中jqueryui对话框

javascript jquery css jquery-ui

Javascript 对中jqueryui对话框,javascript,jquery,css,jquery-ui,Javascript,Jquery,Css,Jquery Ui,以前有人遇到过这种情况吗？我有一个jQueryUI对话框，它在FF和IE中完全居中，但在Chrome中却停留在左侧代码相当标准。尽管如此，我还是将其复制到下面： <script> $(function() {$('#dialog1 ').dialog({autoOpen: false, width: 700, height: 400, buttons: { "Ok": function() {

以前有人遇到过这种情况吗？我有一个jQueryUI对话框，它在FF和IE中完全居中，但在Chrome中却停留在左侧

代码相当标准。尽管如此，我还是将其复制到下面：

<script>
$(function() {$('#dialog1 ').dialog({autoOpen: false, 
width: 700, height: 400, buttons: {
                        "Ok": function() { 
                            $(this).dialog("close"); 
                            }, 
                        "Cancel": function() { 
                            $(this).dialog("close"); 
                            }
                        }
                    });
        });
</script>

<div id="dialog1">Hello</div>


$（function（）{$（'#dialog1'）。dialog（{autoOpen:false，
宽度：700，高度：400，按钮：{
“Ok”：函数（）{
$（此）.dialog（“关闭”）；
}, 
“取消”：函数（）{
$（此）.dialog（“关闭”）；
}
}
});
});
你好

它是使用

$（“dialog1”）打开的。dialog（“打开”）

当单击按钮时

如果将其添加到样式表中，应该可以解决您的问题：

.ui-dialog { margin:0 auto; }

我通过绑定

窗口

调整大小

事件解决了这个问题

var $dialog = $("#dialog");
$dialog.dialog();

$(window).resize(function(e){
    var $w = $(this),
        $d = $dialog.parent(),
        x = $w.width()/2-($d.width()/2),
        y = $w.height()/2-($d.height()/2);
    $dialog.dialog('option', 'position', [x, y]);
});

选中此项。

最新下载的jquery ui具有此对话框样式

.ui-dialog 
{ 
   position: absolute; 
   padding: .2em; 
   width: 300px; 
   overflow: hidden; 
}

这在chrome中绝对有效。我想旧版本的position:relative可能是你的问题

我两天前下载了1.8.9的平滑度主题，也遇到了同样的问题。margincss解决方案适合我。我在主题后加载其他样式规则以覆盖某些主题设置。不知道为什么会丢失…

如果有人在IE上有此问题，但在Chrome或FF上没有，请尝试向页面添加一些doctype。这对我很有用：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

我很想在回调中专门设置它的样式。带

位置：绝对；左：50%；左边距：-350px

是的，我有这个确切的问题，也对解决方案感兴趣。我使用的是最新版本-1.8.9，Chrome只是拒绝将对话框居中：（@crimson yes mVchr的解决方案工作得很好，但当我将CSS改为使用绝对定位时，它也修复了它。奇怪。它成功了！为什么CSS中忽略了这一点？是否已经报告了一个错误？我不知道，与jQuery工具相比，我不使用或不喜欢jQuery UI…所以报告的责任在你身上！）