0

我正在尝试使 ericmmartin simplemodal 对话框更宽更高。我的要求是，如果内容很长，对话框将显示滚动条，它使用开箱即用的设置来实现。

如果我更改给定的 css 示例：#simplemodal-container {height:360px; 宽度：600 像素；说宽度：700px；内容只是向下溢出对话框。

如果我尝试在点击调用中设置宽度，如 Eric 的示例中所示： $("#sample").modal({ minHeight:400, minWidth: 600 });

(http://www.ericmmartin.com/projects/simplemodal/) 没有任何变化。请问有什么想法吗？理想情况下，如果内容长于 500 像素，我希望模态始终显示垂直滚动条。

4

2 回答 2

1

通过 CSS 为模态容器设置样式和大小。然后，当您通过 jQuery 实例化模态对话框时，使用“自动”大小选项动态处理对话框的大小。

就我而言，我们有多个模式对话框可以出现在同一页面上。由于 SimpleModal 对话框将包含模态容器，因此以全面的方式将宽度和高度应用于 simplemodal-container 类是不可行的。

这是我刚刚处理的示例标记。

<div id="accountCanceled" class="simplemodal-container">
    <div id="cancelWrap" class="box">
        <!-- Modal dialog markup goes here, all styled by an external CSS. -->
    </div>
</div>

这是 CSS 的一部分，用于设置上面显示的 #cancelWrap div 的宽度。

#cancelWrap {
    width: 100%;
    max-width: 560px;
}

这是相关的jQuery。

  $canceledAlert = $('#accountCanceled');
  $canceledAlert.modal(
     {  containerCss: {
           height: 'auto',
           width: 'auto',
        }
     }
  );

请记住将“自动”设置用引号括起来。

当显示此 SimpleModal 对话框时，它的容器将动态调整大小以适合 #cancelWrap div 的内容。希望这可以帮助某人。

于 2013-07-26T14:43:28.033 回答
0

设置模态height并width使其auto不显示滚动条并根据其中的内容自动调整大小。

编辑

让模态框有一个固定的高度和一个设置的 css 属性overflow:scroll

于 2012-05-21T10:00:47.303 回答