【发布时间】:2019-02-12 23:41:05
【问题描述】:
实际上我有一个 iframe 页面,我在其中将一些数据从数据库中加载到一个表中,因此 iframe 的高度会有所不同。
就像现在模式正在加载 iframe 并且如果它的高度大于 300px 会有一个滚动条但是问题是当内容小于 300px 时就像你在屏幕上看到的那样有很多白色空间。
因此,我可以通过设置比较滚动条的最大高度来删除该空白并根据 iframe 高度调整模态框的大小。
这里是模态代码:
<div class="modal fade" id="exampleModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header bg-light">
<h5 class="modal-title" id="exampleModalLabel">User update: </h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
<div id="body" class="modal-body mb-0 p-0">
<div class="embed-responsive z-depth-1-half" style="height: 100%; max-height:300px;">
<iframe id="frame" class="embed-responsive-item" src="user.aspx"></iframe>
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-primary">Save</button>
</div>
</div>
</div>
</div>
【问题讨论】:
-
对此不确定,但我认为您需要使用 iframe 内部的 postMessage(或 BroadcastChannel)来发送具有表格高度的消息并在 iframe 上设置高度属性或内联样式,因为 iframe里面的页面高度和高度没有连接。
标签: javascript html css iframe