Question

我已经研究了几天而且我被困了......我读了这页：

和本页：

Auto resize iframe height when the height of the iframe contents change (same domain)

当包含iframe的maine index.html首次加载时，调整iframe似乎相对容易，但一旦iframe更改了内容，我就无法弄清楚如何重新调整iframe的大小。

我的index.html：

<body>
<iframe seamless frameborder="0" name="top" id="top" src="venues.php" width="100%" height="100" /></iframe>
<iframe seamless frameborder="0" name="main" id="main" src="admin.php" width="100%" height="2000" /></iframe>

当venues.php加载它是100px（这很好）但是当某人在venues.php页面内的（内部，相同域）链接中进行clisk时，我需要调整“顶部”框架高度以适应新内容。

我尝试了很多解决方案，我总是只能在第一次加载时调整大小，但是当有人点击它时不会。

由于

Answer 1

您可以使用mutation observer事件和postMessage API，创建和实现可以协商经常更改的iframe的维度度量的脚本非常困难。我放弃了从头开始编写的东西并使用了这个小插件：

https://github.com/davidjbradshaw/iframe-resizer

此 Plunker 演示了在调整iframe大小时检测到mutation observer事件触发时使用此插件。

PLUNKER

Answer 2

你可以看看David Bradshaws git repo

他开发了一个很好的脚本来完成你想要的工作。

保持相同和跨域iFrame的大小适合其内容，并支持＆gt;窗口/内容大小调整，页面链接，嵌套和多个iFrame。＆gt;（依赖免费，IE8 +）http://davidjbradshaw.github.io/iframe-resizer/

iframe内容更改时调整iframe高度（相同域）

2 个答案: