Question

当我在打开对话框后增加对话框的大小时，对话框的高度和宽度会增加，但对话框标题栏的宽度不会增加。我只是不明白为什么会这样。

这是我的代码：

<style type="text/css">
    .BusyStyles {
        background-image: url('../images/ajax-loader.gif');
        background-repeat: no-repeat; background-position: center center; 
        height: 80px;
        width: 180px;
    }
</style>

<script type="text/javascript">
    $("#dialog").dialog({
        autoOpen: false,
        height: 80,
        width: 180,
        modal: false,
        draggable: true,
        resizable: false,
        position: 'center',
        show: {
            effect: "fade",
            duration: 2000
        },
        hide: {
            effect: "fade",
            duration: 500
        }
    });

    $("#dialog").removeClass('ui-dialog-content ui-widget-content').addClass('BusyStyles')
    $("#dialog").dialog("open");
</script>

在另一个按钮上单击我正在增加对话框的大小：

$(".ui-dialog").animate({
    left: $(document).width() / 2 - $("#dialog").width() / 2, 
    top: $("#dialog").top
}, 1000);

我需要在代码中添加什么才能使结果对话框标题宽度随对话框宽度而增加？

由于

Answer 1

您应该使用option方法来增加对话框大小：

$( "#dialog" ).dialog('option', 'width', 600);

Answer 2

使用例如FireBug来查看哪个div是所有其他div对话框的父容器（jQuery对话框是从许多div元素构建的）。然后你会确定你正在调整正确的div。标题栏将大小调整......

jQuery对话框标题栏宽度问题

2 个答案: