当您缩小浏览器时，如何创建自动调整 iframe 的大小？答案

【问题标题】：How do you create auto resizing a iframe when you make your browser smaller?当您缩小浏览器时，如何创建自动调整 iframe 的大小？
【发布时间】：2012-02-24 14:02:32
【问题描述】：

有没有人知道在缩小浏览器时自动调整 iframe 大小的方法？？

【问题讨论】：

How to resize iframe when parent window resizes的可能重复
嘿 MK - 正是我需要的 - 谢谢 :)
检查这是最好的预览样本stackoverflow.com/questions/10845452/…

标签： javascript iframe

【解决方案1】：

您可以将处理程序附加到 window.onresize 事件，然后适当地调整 IFRAME 的大小。

我更喜欢 jQuery：

$(window).resize(function() {
  $('IFRAME').width($(window).width());

});

【讨论】：

【解决方案2】：

一种选择是以百分比指定<iframe> 的大小。

【讨论】：

我需要高度来自动调整大小

【解决方案3】：

还没有尝试过，但我想您可以使用百分比宽度而不是固定宽度。在这种情况下，您可能还应该添加最小宽度和高度，以避免它变得太小：

iframe
{
   width: 50%;
   height: 50%;
   min-width: 300px;
   min-height: 300px;
}

【讨论】：

【解决方案4】：

您也可以使用this。

基本上它在子页面中使用callResize()，在父页面中使用resizeIframe()。

【讨论】：

【解决方案5】：

如果您想使用 CSS 媒体查询，也可以不使用 JavaScript。在此处查看此示例：

http://ie.microsoft.com/testdrive/HTML5/CSS3MediaQueries/Default.html

它们通常用于“响应式设计”。

【讨论】：