javascript - 向下滚动时的 jQuery 对话框位置

Question

我正在使用这个 javascript/jQuery 打开一个对话框，但是当我在页面上向下滚动并在关闭第一个窗口后打开另一个窗口时，该窗口将在我的选择位置打开，加上我的位置向下滚动。当我尝试移动它时，它会一直向下跳动，导致非常烦人的结果。

function showDialog(url) {

    dialogFrame = $('<iframe style="width:100% !important;" frameborder="0" id="Dialog" src="' + url + '" />').dialog({
        autoOpen: true,
        height: 500,
        width: 1000,
        title: 'myWindow',
        resizable: false,
        modal: true,
        position: {
            my: "center",
            at: "center",
            of: window
        }
    });
}

如何防止这种行为？它可能是 position : { } 但它应该是什么？

Answer 1

当 body 具有 CSS 属性 position:relative; 时，我遇到了与 jQuery UI 对话框相同的问题。您可能想检查一下是否是这种情况。

在我的例子中，我无法删除 position:relative; 所以我决定覆盖 top 值并使用固定定位:

$(".dialogFrame").dialog({
    // ...
    open: function(event, ui) {
        $(event.target).parent().css('position', 'fixed');
        $(event.target).parent().css('top', '20px');
    }
    // ...
});

可以通过计算屏幕的有效中心来优化脚本。