0

我正在使用 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>
4

2 回答 2

3

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

于 2013-06-20T15:48:07.867 回答
1

你有两个选择来做到这一点。您可以拥有固定的宽度和高度，并将溢出设置为自动，就像已经建议的那样。如果您正在寻找灵活的宽度，您也可以相对于窗口的大小来做。

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

然后您可以在应用宽度时将其相乘以获得百分比：

width: getWidth() * 0.5; // A 50% width
于 2013-06-25T10:09:29.820 回答