Question

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

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

我希望你能帮助我，谢谢你

TIA

Answer 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>

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

1 个答案: