使用固定位置时，jQuery UI 对话框离开屏幕

Posted 2023-05-08

【中文标题】使用固定位置时，jQuery UI 对话框离开屏幕

【英文标题】：jQuery UI dialog goes offscreen when using position fixed

【发布时间】：2017-11-16 10:00:40

【问题描述】：

我正在使用 jQuery UI 来显示一个对话框，并且我希望它始终保持在同一位置，而不管滚动状态如何。所以我只是添加了css代码

.ui-dialog 
    position: fixed;

现在，如果您将对话框拖到底部，则可以将其移出屏幕，使其完全消失。任何人都知道如何防止这种情况？ 请参阅此小提琴进行演示：https://jsfiddle.net/d0pgfwk7/

【参考方案1】：

我终于解决了我的问题。解决方案不是使用对话框的可拖动设置，而是使用小部件本身。所以我的代码现在看起来像这样：

$("#dialog").dialog(
    
      draggable: false,
      dialogClass: 'my-dialog'
    
);
$('.my-dialog').draggable(
    containment: 'window'
);

【参考方案2】：

据我所知，您说 jquery 对话框是可拖动的。 如果是这种情况，这是非常简单的修复 只需使用

 draggable: false

在这里查看小提琴https://jsfiddle.net/d0pgfwk7/

编辑：请看这里的小提琴

http://jsfiddle.net/tj_vantoll/LZ9SR/

更多详情请参考此链接https://bugs.jqueryui.com/ticket/8741

【讨论】：

好吧，我应该说对话框应该是可拖动的。 ;)

@MatthewDarton 请看看新的小提琴

嗯...通过将我的 jquery ui 降级到 1.9。它确实有效。但这对我来说不是一个选择，因为我项目中的其他功能取决于当前的 jquery ui 版本。