使用jQuery对话框自动调整宽度和高度

Question

我正在使用jQuery UI对话框来加载ajax内容.它正确地垂直定位对话框,但是,width: "auto"选项它不会水平居中.它偏离中心,就像中心右侧100px一样.

这是我的代码:

$('.open').live('click', function(e) {
    e.preventDefault();
    $("#modal").load($(this).attr('href')).dialog({
        title: $(this).attr('title'),
        modal: true,
        autoOpen: true,
        draggable: false,
        resizable: false,
        width: 'auto',
        position: ['center', 'top']
    });
});

任何想法,如果有办法让它自动调整大小并保持中心？

编辑:这工作:

$("#modal").load($(this).attr('href'), function() {
    $("#modal").dialog({
        title: $(this).attr('title'),
        width: 'auto',
        modal: true,
        autoOpen: true,
        draggable: false,
        resizable: false,
        position: ['center', 150],
        create: function(event, ui) {}
    });
});

Answer 1

试试这个代码。它对我有用并且是跨浏览器的。

$(window).resize(function(){
        $('.className').css({position:'absolute', left:($(window).width() 
        - $('.className').outerWidth())/2,
        top: ($(window).height() 
        - $('.className').outerHeight())/2
        });
});

// To initially run the function:
$(window).resize();

由此创建一个对话框应该相当简单。