问题标签 [iframe-resizer]

我有一个带有一些 iframe 的页面，我使用 iframe-resizer 插件来自动调整 iframe 的大小，但它有一个非常奇怪的行为：一开始只有一个 iframe 是可见的，其他的都是 display: none。有时当我从一个 iframe 切换到另一个 iframe 时，新的 iframe appaer 在 Firefox 上的高度为 0，在 chrome 上的高度为 4398px（太高），常见的行为是，调整浏览器的大小，iframe 获得正确的高度。

我能做些什么？

我正在尝试使用以下代码：https ://github.com/davidjbradshaw/iframe-resizer

在我的 index.html 页面中，我已经包含（并且确实加载了）：

在我的 iframe 内容页面中，我包括：

我的 AngularJS 控制器是：

当主机页面加载并尝试调整 iFrame 大小时，我收到错误消息：

谢谢你的帮助。

我试图将我们的网站添加到我们的客户网站之一并使用 iframe 调整大小。他们的网站使用 Brightspot CMS。所以这给了 iframe-resizer 未定义的错误。

当我对 iframe resizer js 文件进行一些更改时，我将其删除

并且只保留

通过此更改，一切正常。知道为什么会发生这种情况吗？

我有一个要从中提取内容的外部域“domainB”。domainB 的脚本中包含 iframeResizer.contentWindow.min.js

我的域“domainA”包括 iframeResizer.min.js，我这样称呼它：

无论我将“heightCalculationMethod”更改为什么，它都不会对 iframe 的高度产生任何影响。下面是日志

[iFrameSizer][主机页面：iFrameResizer0] 添加了缺少的 iframe ID：iFrameResizer0 ( http://domainB/ ) iframeResizer.min.js:8
[iFrameSizer][主机页面：iFrameResizer0] iFrameResizer0 iframeResizer.min.js 禁用了 IFrame 滚动： 8
[iFrameSizer][主机页面：iFrameResizer0] [init] 发送消息到 iframe[iFrameResizer0] (iFrameResizer0:8:false:true:32:true:true:null:taggedElement:null:null:0:false:parent:scroll ) targetOrigin: * iframeResizer.min.js:8
[iFrameSizer][主机页面: iFrameResizer0] [iFrame.onload] 发送消息到 iframe[iFrameResizer0] (iFrameResizer0:8:false:true:32:true:true:null:taggedElement :null:null:0:false:parent:scroll) targetOrigin: *

所以看起来它正在工作，没有错误，但它没有效果。有没有更好的方法来做到这一点，实际上会改变 iframe 的高度？

我使用 iframe 在我的应用程序中嵌入一个站点并使用 iframe 调整大小库。

和代码脚本

我想在加载父页面后获取height内容mysite.com，但我想到了一种方法。

我在这里使用以下设置实现了 iFrameResizer 插件：

并且 iframeSizer.contentWindow.min.js 已添加到 iframe 内容窗口 - 我可以看到滚动条正在工作，这告诉我 iFrame Resizer 插件已正确实现 - 但高度未正确调整大小？

这是控制台结果

我想也许问题可能来自托管在安全服务器上的 iFrame 内容？？？？

如果有人能够提供一些建议或建议，我将不胜感激。

我正在使用 Javascript https://github.com/davidjbradshaw/iframe-resizer使 iframe 始终与内容的高度相同。

这工作得很好，但例如在我的手机上它不工作（<〜525px它将高度设置为0px

您可以在http://www.eckl.com/edentity/neuwagen上看到它（日志已启用）。

- 日志 -

[iFrameSizer][主机页面：edentity-iframe] 检查高度在 0-Infinity 范围内 jquery.responsiveiframe.js?1484233957:8 [iFrameSizer][主机页面：edentity-iframe]

检查宽度在 0-Infinity 范围内 jquery.responsiveiframe.js?1484233957:8

[iFrameSizer][宿主页面：edentity-iframe] 请求动画帧 jquery.responsiveiframe.js?1484233957:8 [iFrameSizer][宿主页面：edentity-iframe]

IFrame (edentity-iframe) 高度设置为 0px jquery.responsiveiframe.js?1484233957:8

[iFrameSizer][主机页面：edentity-iframe] 检测到隐藏 iFrame，创建可见性侦听器 VM19339:9 [iFrameSizer][edentity-iframe] 触发事件锁定关闭

--结束日志--

谢谢。

我目前正在开发一个小部件项目，您单击一个按钮并在上方打开一个气泡。所有这些都在动态创建的 iframe 中。我正在使用 @davidjbradshaw 的 Iframe-Resizer 根据内容调整 iframe 的大小。到目前为止，高度调整大小工作完美。我的问题是当我在打开气泡后关闭气泡时，iframe 的宽度不会调整回原始大小。

这是iframe 中的html

这是显示和隐藏气泡的javascript代码：

我试图在 EventListener() 中更改 iframe 的宽度，但没有成功。我还注意到，在我关闭气泡后，iframe-width 仍然存在，因为它仍然包含气泡，并且当我检查它时，虽然我已将边距设置为 0，但它看起来徽标按钮具有正确的边距。

使用 iframe-resizer 时是否有人遇到相同或类似的问题？任何建议、提示或帮助将不胜感激。

这是应用程序的屏幕截图，因为它仍然只在本地运行。 https://drive.google.com/a/orat.io/file/d/0B12BLLTyY7C2TEhPTnFVMHBHTkE/view?usp=sharing

我正在使用https://github.com/davidjbradshaw/iframe-resizer。

iframeResizer.min.js 在父页面中并且

iframeResizer.contentWindow.min.js 在孩子

日志记录似乎显示消息开始正常 - 它像这样开始

[iFrameSizer][主机页面：contentframe] [iFrame.onload] 发送消息到 iframe[contentframe] (contentframe:8:false:true:32:true:true:null:bodyOffset:null:null:0:false:parent:滚动）targetOrigin：* iframeResizer.min.js：11:62

[iFrameSizer][contentframe] 初始化 iFrame ( http://xxxxxxx/ )

iframeResizer.contentWindow.min.js:9:693

[iFrameSizer][contentframe] 父级的 TargetOrigin 设置为：* iframeResizer.contentWindow.min.js:9:693

[iFrameSizer][contentframe] HTML & body height 设置为“auto” iframeResizer.contentWindow.min.js:9:693

[iFrameSizer][contentframe] 启用公共方法 iframeResizer.contentWindow.min.js:9:693

[iFrameSizer][contentframe] 添加事件监听：动画开始

并以

[iFrameSizer][contentframe] 在 iframeResizer.contentWindow.min.js:9:693 上触发事件锁定

[iFrameSizer][contentframe] 向主机页面发送消息 (contentframe:655:748:init) iframeResizer.contentWindow.min.js:9:693

[iFrameSizer][contentframe] 触发事件锁定关闭 iframeResizer.contentWindow.min.js:9:693

[iFrameSizer][contentframe] -- iframeResizer.contentWindow.min.js:9:693

[iFrameSizer][主机页面：contentframe] iFrame 没有响应。检查 iFrameResizer.contentWindow.js 是否已在 iFrame 中加载

我正在尝试在 Moodle 中使用它，如果这有什么不同？

有什么想法可以阻止父母接收消息吗？在演示页面上，messgaing 似乎会导致像这样将消息返回给父级

[iFrameSizer][主机页面]收到：[iFrameSizer]iFrameResizer0:284:1588:init

但我似乎没有收到收到的消息（所以它没有调整父母的大小）

我正在开发一个自定义网站构建器，并有一个 iframe 作为响应式网站的预览。为了让网站“缩小”，这样网站就不是移动大小的，我使用 css 比例并像这样转换原点：

由于它是网站构建器，因此某些部分可能会被隐藏，从而改变 iframe 的高度。如何获取 iframe 的高度并将其设置为容器？我正在尝试使用这个 iFrame Resizer ( https://github.com/davidjbradshaw/iframe-resizer )，但我认为我在 iframe 上使用的比例 css 搞砸了。该插件运行，然后我在底部有大量额外的空白。我已经尝试了他们所有的“heightCalculationMethod”，他们都有相同的结果。如果我使用这个 css 比例，有没有办法可以编写自己的自定义高度计算？