问题标签 [iframe-resizer]

我想使用 srcdoc 中的 html 调整 iframe 的高度，我选择使用iframe-resizer库。但是 iframe 永远不会调整大小，并且永远不会调用回调。

网页：

JS：

这是我的jsfiddle

我有一个已应用的按钮

单击按钮时，页面视图会完全改变，因此我希望将用户滚动到页面顶部。

这个 scrollto 函数似乎运行良好，虽然 return false; 似乎需要这样做才能生效。

我看到的问题是，在某些浏览器上，包括 chrome、IE 和移动浏览器，当单击按钮时，父视图滚动到顶部，但 iframe 高度元素变为 0px？

在调整屏幕大小时，iframe 会再次调整为正确的大小。

按下按钮后查看控制台日志，我看到以下内容：-

调整大小时

任何建议我都会非常感激，我想我已经正确阅读了 davidjbradshaws 实施指南，但我无法理解为什么这一部分不应该工作

先感谢您。

根据@david-bradshaw 的要求添加了新日志

我需要根据内容高度动态调整 iframe 高度。我正在使用 davidjbradshaw 的iframeResizer.js来完成这项任务。我也在内容页面中添加了iframeResizer.contentWindow.js。和iframe 页面中的iFrameResizer.min.js。

调用iFrameResize({log:false});时，我在控制台中收到以下错误：

未捕获的 ReferenceError：未定义 iFrameResize

我也尝试过调用iFrameResize({log:false})iframe 的 onload，但我仍然遇到同样的错误。

我正在构建一个只能通过 iframe 看到的网站。我还添加了一个可以调整自动调整高度的脚本。

但是加载我的博客，因此不得不一次加载两个页面的额外负担。为了应对，我应用 OnClick 来加载 iframe。

自动调整大小但结果是行不通。

加载 iframe 代码：

你知道如何使用自动调整大小来实现这样的技巧吗？请帮助我，谢谢..

编辑

以下代码片段调整我的大小

存储在已加载的站点：

存储在包含 iframe 的站点上：

我正在使用来自http://davidjbradshaw.github.io/iframe-resizer/的iframe 脚本，我想在此脚本中添加固定位置以使 iframe 固定在顶部但无法实现。请帮助我实现这一目标。

提前致谢。

我已经尝试让这个 I-Frame Resizer 在朋友网站上工作几个小时，但无法弄清楚我做错了什么。它在我的 iPhone 上运行良好，但在台式机上完全不行。任何浏览器。

网址是http://www.tomhammangphotography.com/blog.html

在控制台中，我两次收到相同的错误-“iframeResizer.min.js:8 无法在 'DOMWindow' 上执行 'postMessage'：提供的目标来源（' http://www.tomhammangphotography.com '）没有匹配收件人窗口的来源。”

我在 js 文件 iframe.js 中设置了我的选项，并将 windowResizer 嵌入到博客标题中。

据我所知，Javascript 文件调用正确。

我将 checkOrigin 设置为 False，并将高度计算器设置为最低元素。

任何帮助将不胜感激。非常感谢你。

〜特伦特

我有一个不在同一个域中的页面，我希望能够在将页眉和页脚加载到另一个特定站点时隐藏页眉和页脚。

这可以使用 iframe-resizer 完成吗？我以前用过它，效果很好，但从未尝试过交叉通信，我认为我会遇到安全问题。

我希望我可以调用 postMessage 到子页面上的 JS 函数来隐藏元素。

我正在使用 iframe-resizer 将 iframe 的高度调整为其内容的高度。到目前为止工作得很好，我只有一个关于 witdh 的问题。加载后，它需要屏幕宽度来设置 iframe，这对于桌面大小的屏幕是可以的，但对于移动设备，我希望允许在 x 轴上滚动。有什么建议么？

这是我的 iframeresize 初始化：

这是我的CSS：

和 iframe 的 html 部分：

这是 iframeresizer 日志的样子：

[iFrameSizer][主机页面：glu] iframe 滚动禁用 glu iframeResizer.min.js:8[iFrameSizer][主机页面：glu] [init] 将消息发送到 iframe[glu] (glu:8:false:true:32 :true:true:null:lowestElement:null:null:0:true:parent:scroll) targetOrigin: *

iframeResizer.min.js:8 [iFrameSizer][主机页面：glu] [iFrame.onload] 发送消息到 iframe[glu] (glu:8:false:true:32:true:true:null:lowestElement:null:null :0:true:parent:scroll) targetOrigin: *

iframeResizer.contentWindow.min.js:9 [iFrameSizer][glu] 初始化 iFrame ( https://www.kultureshop.in/blog/about-ks/ )

您会注意到主机页面向托管/iframe 页面发送了 2 条消息。第一个被忽略了。iframe 页面对第二条消息做出反应。

问题是第一条消息和第二条消息之间存在很大的时间间隔。

有谁知道主机页面脚本在将消息重新发送到 iframe 页面之前等待多长时间？这可以减少吗？

我有一个站点 A，其中包含一个包含站点 B 内容的框架并且不会自动调整大小，并尝试更改 heightCalculationMethod 的值并始终给我相同的大小，日志总是向我显示以下内容：

1.[iFrameSizer][主机页面：iFrameResizer0]添加缺少的iframe ID：iFrameResizer0()

2.[iFrameSizer][主机页面：iFrameResizer0] iFrameResizer0禁用IFrame滚动

3.[iFrameSizer][主机页面：iFrameResizer0] [init] 发送消息到 iframe[iFrameResizer0] (iFrameResizer0:8:false:true:32:true:true:null:lowestElement:null:null:0:false:parent:滚动）目标来源：*

只有这样。

恢复

站点 A： 域： a.com 库： iframeResizer.js 和 iframeResizer.contentWindow.js

js：

html:

其中 url 是一个包含站点 B 的 url 的变量

站点 B： 域： b.com 库： iframeResizer.contentWindow.js