google-chrome - JQuery-ui 对话框跳转到 Chrome 中的页面底部

Question

我正在使用 jquery ui (jquery-ui-1.10.3) 并且在 Chrome 中遇到了一些对话框问题。

我正在通过以下方式打开对话框：

$('#dialog').dialog({
    width: 400,
    buttons: {
        "save": function() { update(); $( this ).dialog( "close" ); }
    }
});

此对话框是可拖动的。对话框完美显示，但只要我需要拖动它，对话框就会/跳到页面底部，即使在滚动下方。这仅在 Chrome 中发生。

也许有人面临同样的问题。有任何想法吗？

谢谢

score 7 · Accepted Answer

这是 jQuery UI 1.10.3 - http://bugs.jqueryui.com/ticket/9315中的一个错误。也可能被标记为jQuery ui 对话框拖动问题的欺骗。

score 3 · Accepted Answer

3

这似乎可以解决它

html, body {position: relative}

于 2014-05-14T06:00:27.570 回答

score 1 · Accepted Answer

我已将父元素（在我的情况下为 body 标签）的位置设置为静态（它是相对的）并且它解决了问题。

if (isChrome){ document.getElementsByTagName("body")[0].style.position = 'static'; }

当然，之前需要计算“isChrome”变量。

您还必须检查此更改是否不会破坏您现有的布局。

希望它可以帮助
安德拉斯

score 1 · Accepted Answer

试过了

html, body {position: relative}

但这对我不起作用。但是，发现这对我的情况有用。

body { height: 100%; }

修复了很多奇怪的问题。

score 0 · Accepted Answer

0

对我来说 jquery-ui 1.10.1 运行良好。1.10.3 中的上述错误似乎也在 1.10.4 中。

于 2014-09-30T14:43:19.220 回答

score 0 · Accepted Answer

它在 jQuery UI 1.10.3 中不起作用，即使 bug 说它已修复。我发现它固定在：jQuery UI 1.11.2，没有尝试过以下任何版本。但是 1.11.2 一切都好

score 0 · Accepted Answer

尝试

$( "#dialog-confirm" ).dialog({position: 'center',...

使用 jquery-ui-1.9.2.custom 解决了我的问题

score 0 · Accepted Answer

添加样式表：

<link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/smoothness/jquery-ui.css">

为我修好了

score 0 · Accepted Answer

为必要的元素添加相对定位：

html, body, header, nav, main, footer, article, section, summary{ position: relative; },

我为我的身体元素添加了相对定位，这解决了我的问题。我正在使用 jquery-ui-1.10.4

9 回答 9