Question

在iframe中我需要弄清楚视觉大小到底是什么（使用js或jquery）。

在此示例中，仅显示iframe的一部分。 iframe大小为300x300但div将其限制为300x100。

<div style="max-width: 300px; max-height: 100px; overflow: hidden">
<iframe width="300" height="300" src="http://www.rapidtables.com/web/tools/window-size.htm" style="border:none"></iframe>
</div>

如何从iframe内部检测实际可见尺寸？

尝试

window.clientHeight
window.outerHeight
window.innerHeight
window.availableHeight
$(window).height();

Answer 1

首先将ID添加到iframe：

<div style="max-width: 300px; max-height: 100px; overflow: hidden">
<iframe id="myIframe"width="300" height="300" src="http://www.rapidtables.com/web/tools/window-size.htm" style="border:none"></iframe>
</div>

然后使用jQuery获取iframe内容的实际高度；

$('#myIframe').contents().find('body').height()

iframe获得可见大小

1 个答案: