是否可以使 Jquery 对话框响应？

Is possible to make Jquery Dialog responsive?

是否可以使 Jquery UI 对话框响应？我希望我的对话框的大小根据屏幕大小和对话框的内容自动计算。这怎么可能实现呢？ 谢谢！

对话框小部件使用 jQuery UI CSS framework 来设计其外观和风格。如果需要对话框特定样式，可以使用以下 CSS class 名称：

  • ui-dialog：对话框的外层容器。
    • ui-dialog-titlebar：包含对话框标题和关闭按钮的标题栏。
      • ui-dialog-title：对话框文本标题周围的容器。
      • ui-dialog-titlebar-close: 对话框的关闭按钮。
    • ui-dialog-content：对话框内容周围的容器。这也是小部件实例化的元素。
    • ui-dialog-buttonpane：包含对话框按钮的窗格。仅当设置了 buttons 选项时才会出现。
      • ui-dialog-buttonset：按钮本身周围的容器。

此外，当设置 modal 选项时，名称为 ui-widget-overlay class 的元素将附加到 <body>.

除此之外你还可以使用 dialogClass 

$( ".selector" ).dialog({
  dialogClass: "responsive_class"
});

指定的 class 名称将被添加到对话框中，用于附加主题。

如另一个答案中所述，'dialogClass' 是一种覆盖 jQuery UI 对话框的 CSS.

的方法

但是，由于 jQuery UI 对话框利用内联 CSS 来实现放置、宽度等，因此可能会出现一些问题。由此产生的后果是您必须使用 '!重要事项分散在您的 CSS 中以实现响应行为。我 运行 遇到了同样的问题，所以我撰写了 jQuery UI Dialog Extended.

此插件为 jQuery UI 对话框提供了额外的功能，包括响应行为（高度响应）。