在$(document).ready函数中打开时,jQuery UI对话框位置不正确

时间:2012-12-08 16:21:35

标签: jquery position modal-dialog document-ready

我的jQuery UI模式对话框显示从按钮单击事件显示的中心屏幕,但是,如果我在document.ready期间打开它,在下面的loginDialog()方法中,它显示在可滚动窗口的底部。

我怀疑这个问题与我在对话框打开调用之前在document.ready中加载大量图像这一事实有关。屏幕的可视部分被禁用,但对话框位于滚动窗口的底部。有趣的是注意到对话框位置选项

position: 'top', 

在document.ready期间似乎不起作用。

$(document).ready(function () {

        serverGetMenu();
        getPhotos();

        $("#loginDialog").dialog({
            .............
        });

        if (isLoginRequest()) {
            loginDialog();
        }
    });

如何在document.ready期间或之后不久正确放置对话框?

1 个答案:

答案 0 :(得分:0)

问题已解决:原来我的jquery-ui-1.9.2.custom.css不正确。

我原来的ThemeRoller'build'没有包含Dialog小部件,所以我创建了一个新的构建来包含Dialog小部件。然后我用新的替换了我现有的jquery-ui-1.9.2.custom.js但我没有更新jquery-ui-1.9.2.custom.css文件。

由于我缺乏jQuery UI的经验,我没有意识到这一点,虽然我的Dialog工作,它的样式只是有点偏离它应该是什么,我不得不添加一些样式来纠正小问题。正确的jquery-ui-1.9.2.custom.css也解决了我必须修复的样式“问题”。

我觉得很有意思的是,在我试图在document.ready中显示我的Dialog之前,缺少的Dialog样式类并没有真正表现出那么大的“问题”。我从来不知道造型可能会导致如此奇怪的问题而且难以追踪。