jQueryUI对话框：调整大小干扰向下滚动箭头

In an application I'm developing, I pop up Help in a modal jQueryUI dialog. For the most part, it works beautifully. There is one problem: if you try to use the arrow on the lower right of the dialog to scroll the help text, you can't, because it is in the same place as the mouse-drag resize for the dialog.

在我正在开发的应用程序中，我在模态jQueryUI对话框中弹出帮助。在大多数情况下，它工作得很漂亮。有一个问题：如果您尝试使用对话框右下角的箭头滚动帮助文本，则不能，因为它与对话框的鼠标拖动调整大小相同。

I realize this would not happen if I used the jQueryUI dialog "button" option to add a "Close" button at the bottom of the dialog, but that would be inconsistent with our style elsewhere in the application.

我意识到如果我使用jQueryUI对话框“按钮”选项在对话框的底部添加“关闭”按钮，这不会发生，但这与我们在应用程序中的其他地方的样式不一致。

Anyone know a reasonable way around this? Ideally, I'd like something that would give me a small non-scrolled div at the bottom of this dialog, without affecting other dialogs, so that the mouse-drag resize would fall lower on the screen than the down-arrow.

有人知道一个合理的方法吗？理想情况下，我想在这个对话框的底部给我一个小的非滚动div，而不会影响其他对话框，这样鼠标拖动调整大小会在屏幕上比向下箭头低。

1 个解决方案

#1

Adding a bottom padding to the ui-dialog class in your jquery-ui.xxxx.css should result in the behavior you want:

在jquery-ui.xxxx.css中向ui-dialog类添加底部填充应该会产生您想要的行为：

.ui-dialog {
    ... Existing CSS...
    padding-bottom: 15px !important;
}