Question

我正在使用jqModal使用包含要填写的表单的ajax创建模态窗口。父窗口仅包含大约半页的数据，因此不包含滚动条。加载模式窗口时，窗体溢出页面，底部不可见。在需要时创建包含滚动条的模态窗口或向父窗口添加滚动条以便整个模态可以上下滚动的最佳方法是什么？代码如下：

使用Javascript：

$(document).ready(function () {

    $("#AddGameTypeWindow").jqm({
        ajax: '/maintenance/AddGameType.html',
        modal: true,
        trigger: "#NewGameTypeButton"
    });
});

HTML：

<body>
    <div id="AddGameTypeWindow" title="Add Game Type" style="display:none"></div>
    <div id="AddLocationWindow" class="jqmWindow" style="width:640px;height:480px"></div>
    <table>
        <tr>
            <td>Game Type</td><td><select id="GameType"><option value="0"></option></select>&nbsp;<button id="NewGameTypeButton" class="ui-state-default ui-corner-all"><span class="ui-icon ui-icon-plus"></span></button></td>
        </tr>

Answer 1

如果你的模态是<div id="AddGameTypeWindow" title="Add Game Type" style="display:none"></div>，请尝试给它一个固定的高度并在其样式中添加overflow:auto，这样如果模态内容大于固定高度，滚动条就会出现。

Answer 2

您有两种选择。你可以有一个固定的宽度和高度，并设置溢出自动像已建议的那样。如果您正在寻找灵活的宽度，您也可以根据窗口的大小进行操作。

<script>
  function getWidth(){
    return $(window).width(); 
  }
</script>

然后你可以将它乘以得到宽度时的百分比：

width: getWidth() * 0.5; // A 50% width

jqModal溢出我的页面

2 个答案: