jQuery UI:自动大小和自动中心

时间:2011-05-05 19:49:08

标签: jquery-ui

现在,我有一个人为我制作的网站,不幸的是,我被困住了。我理解了一点,但仍然是一个新手。我有弹出的图片,但每当我将高度和宽度设置为“自动”时,该框位于页面底部?

如果可能的话,我需要它自动调整大小。

请帮我复制我的代码,有人吗?感谢。

<script type="text/javascript">

    function openDialog(url) {
        $("<div class='popupDialog'></div>").load(url)
            .dialog({
                autoOpen: true,
                closeOnEscape: true,
                height: '1012',
                modal: true,
                position: ['center', 'center'],
                title: 'About Ricky',
                width: 690
            }).bind('dialogclose', function() {
                jdialog.dialog('destroy');
            });
    }
</script>

1 个答案:

答案 0 :(得分:16)

您遇到的问题是,当对话框打开时,它是空的并且计算位置。然后加载内容,它不会自动重新计算新的中心位置。您需要在onComplete事件处理程序中自己执行此操作。见下文,我还提出了一些不错的加载文本:)

<script type="text/javascript">

    function openDialog(url) {
        $("<div class='popupDialog'>Loading...</div>")
            .dialog({
                autoOpen: true,
                closeOnEscape: true,
                height: '1012',
                modal: true,
                position: ['center', 'center'],
                title: 'About Ricky',
                width: 690
            }).bind('dialogclose', function() {
                jdialog.dialog('destroy');
            }).load(url, function() {
                $(this).dialog("option", "position", ['center', 'center'] );
            });
    }

    $(window).resize(function() {
        $(".ui-dialog-content").dialog("option", "position", ['center', 'center']);
    });
</script>