javascript - 如何根据 iframe 大小调整引导模式的大小?
问题描述
实际上我有一个 iframe 页面,我从数据库中加载一些数据到一个表中,所以 iframe 的高度会有所不同。
就像现在模态正在加载 iframe 并且如果它的高度大于 300 像素会有一个滚动条,但问题是当内容小于 300 像素时,就像你在屏幕上看到的那样,会有很多空白。
因此,我可以通过设置应该比较滚动条的最大高度来删除该空白并根据 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>
解决方案
删除 height:100% 并添加
#body {
max-height:300px;
overflow-y:scroll;
}
我希望这会奏效。
推荐阅读
- django - 使用 to_internal_value() 和 to_representation() 的 Django Rest Framework 读写平面序列化程序
- python - 如何将 DataFrame 拆分为 FirstName 列和 LastName 列
- android - 在 Recyclerview 列表中闪烁
- python - 使用python请求库在http请求中发送json
- python - 不要让matplotlib自动调整x轴的顺序
- node.js - Nodejs 同步 HTTP 请求
- sql-server - 如何在sql server函数中执行动态sql并返回标量值
- java - 如何在java中管理客户端的多个套接字
- jenkins - JENKINS.SF(访问被拒绝)
- java - 通过 excel vba 执行时,Jar 文件将永远运行