3

这个问题的 jsFiddle

我目前正在使用引导模式，这是一个用于创建弹出框的 jQuery 插件。（如果有人想查看非常短的文档，这里有一个链接——它非常短，所以只需要一分钟）。

不幸的是，我有几个问题：

  1. 我需要能够定义模态弹出框的大小。我尝试了以下方法，但无法正确显示：

    <div class="modal" id="myModal" style="width: 800px; height: 900px;">

  2. 我需要能够默认隐藏模式。目前，它会在页面加载后立即显示。我尝试了以下方法，但它似乎没有正确隐藏：

    $(document).ready(function() { $('#myModal').modal("hide"); });

知道如何解决这些问题吗？

4

8 回答 8

2

在源代码中尝试以下操作。为我工作。

  $('#ModalForm').dialog(
   {
        modal : true ,
        autoOpen : false ,
        height : 300,
        width : 400,
. . . .
于 2012-08-17T09:49:08.433 回答
2

Answer 1: Try defining the modal CSS class and set the width and height. Answer 2: when calling the modal function, pass in an option object with th property "show" as false.

$("#myModal").modal({show: false});

Answer 3: you can handle the "shown" event and wire it up to make an AJAX call to web page and set the result as the inner HTML of the div.

于 2012-04-15T04:38:40.400 回答
1
于 2012-04-15T04:37:39.387 回答
1

try this

<div class="modal" id="myModal" style="width:800px;height:900px;display:none;">
于 2012-04-15T04:38:32.427 回答
1

您可以将.hide类提供给模态框的容器以隐藏它，这是隐藏模态框的默认引导方法。至于大小，您可以再次为您自己的类提供自定义宽度和高度的容器，它应该占用它，您将其添加到内联的方式现在也可以正常工作，只需确保将其添加到主容器。

所以你的模态容器应该看起来像这样：

<div class="modal hide fade custom-size" id="myModal"> ... </div>

注意：添加了.fade添加过渡淡入淡出/滑动效果的类，如果您不想要这些效果，可以将其删除。

至于在加载页面时弹出的模态框，您要删除该行为所要做的就是不要像现在那样调用模态框，这样只有在您单击操作或“启动”时才会弹出模态框模态”按钮。

这是一个清理过的小提琴，你有一些无效的样式，比如float:center（我希望存在一个）：http: //jsfiddle.net/zkzuM/2/，整页演示：http: //jsfiddle.net/zkzuM/ 2/秀/

于 2012-04-15T05:04:29.567 回答
1 
#myModal{
    height:200px;
    width:100px;
}

尝试将这样的内容添加到 css

你的 javascript

$('#myModal').modal({'show':false});
于 2012-04-15T05:10:08.140 回答
1

看看小提琴及其结果。

.modal-body 类的最大高度为 400 像素。如果你想要一个静态高度为 900 像素，你应该设置 .modal-body 的高度和最大高度。否则，关闭按钮及其栏可能会浮在盒子上。

#myModal .modal-body {
  height: 775px;
  max-height: 800px;
}

由于盒子模型的边距和填充，900px 高的 #myModal 是 775px。它总是短 125 像素。如果你想让它动态化，你可以编写如下内容：

$('#myModal .modal-body').height($('#myModal').height()-125);
于 2012-04-15T05:20:07.497 回答
1

  1. 你做得对，但如果它使用最大宽度最小宽度并注释掉它，请查看引导 CSS。

  2. 如果它在 JS 中不起作用，您可以通过将隐藏类放入模态包装器中来实现。

于 2012-11-16T01:29:11.713 回答