jqmodal中的modalbox高度偏移浏览器高度？

【问题标题】：modalbox height offset browser height in jqmodal?jqmodal中的modalbox高度偏移浏览器高度？
【发布时间】：2014-01-30 15:59:22
【问题描述】：

有人可以指出我或给出提示，解决方案如何修改高度偏移到浏览器高度分辨率的模态框？

目前，如果我的模态框高度为 500 像素 x 1200 像素，并且我的浏览器为 1280x1024，则模态框不会滚动并且无法查看框的下方部分。

希望你能帮帮我，谢谢

TIA

【问题讨论】：

标签： jqmodal

【解决方案1】：

我假设您想将模态宽度/高度设置为视口的百分比（例如浏览器窗口）？

您可以使用 CSS 来做到这一点，首先将 html/body 的宽度和高度设置为 100%。

例如，一个大小为视口 50% 并固定在中心的模态框看起来像这样；

<html>
<head>
<style type="text/css">
  html, body { margin: 0; padding: 0; }
  html, body { height: 100%; width: 100%; }

  #modal { 
    width: 50%; 
    height: 50%;

    position: fixed;
    top: 50%;
    left: 50%;

    margin-top: -25%; 
    margin-left: -25%;

    /* display: none; */
  }
</style>
</head>
<body>
    <div id="modal">
        <h1>modal</h1>
    </div>
</body>
</html>

【讨论】：