如何使iframe的高度始终延伸到浏览器窗口的底部?

How would you make an iframe's height always extend to the bottom of the browser window?

本文关键字：浏览器 窗口 底部 iframe 何使 高度      更新时间：2023-09-26

我想生成一个iframe，其高度将扩展到浏览器窗口的底部。如果用户改变了浏览器的高度，那么iframe的高度也应该动态改变。然而，我希望iframe有一个最小的高度，超过它不会进一步缩小。我该怎么做呢?

我正在做一些非常相似的事情。1)获取窗口大小调整事件(我使用jQuery)

$(window).resize(function(){});

2)加入你想要的行动。对我来说，我在文档的主体上明确设置了一个高度，这样我的CSS height:100%在内部容器上就会生效。您可以在函数内执行任何操作:

$(window).resize(function(){
    $('body').height($(document).height());
});

我的标记:

<html>
    <body>
        <div class="full-height">Hello World</div>
    </body>
</html>

我的CSS: 

body {position:relative;}
.full-height {height:100%;}

这将有助于了解您正在使用的内容，但希望这将为您指明正确的方向。

iframe {
  height:100%;
  min-height:300px;
}

您是否尝试过将iframe放入包装器中div

<div id="iframediv" style="min-height:500; overflow:scroll">
    <iframe src="http://google.com">­ </iframe>
</div>

值得一试

相关文章：