用jquery设置fancybox高度

Posted 2023-05-09

【中文标题】用jquery设置fancybox高度

【英文标题】：set fancybox height with jquery

【发布时间】：2013-11-21 12:13:42

【问题描述】：

我想在我的页面上显示一个花式框，显示一个 iframe，其中包含另一个具有动态高度的域的源（因为在 iframe 中，我将转到不同的页面或可能有一些动态内容）。我也可以访问其他域的代码。所以我可以使用 postMessage 将 iframe 的源高度发送到我的页面。但我似乎不知道如何通过代码改变fancybox的高度。

我尝试设置包含 iframe 的所有 div 的高度，包括 iframe 本身：

document.getElementById('fancybox-frame').height = parseInt(height);
document.getElementById('fancybox-content').height = parseInt(height);
document.getElementById('fancybox-outer').height = parseInt(height);
document.getElementById('fancybox-wrap').height = parseInt(height);

而且我知道我的高度没问题，因为它可以在直接集成的 iframe 上完美运行。

有人有什么想法吗？

谢谢

编辑： 我也试过 $.fancybox.update() 但我不太确定如何实现它：

$.fancybox(
'height': height
);
$.fancybox.update();

【问题讨论】：

这可能对***.com/a/10776520/1055987有帮助

fancy box work with iframes in beforeShow function?的可能重复

问题是fancybox iframe 源来自另一个域，这似乎导致类似的东西不起作用。我无法以这种方式访问​​ iframe 内容。

你说你得到了正确的高度，所以尝试将它们放入一个变量中并使用该变量设置 this.height 与 fancybox 回调

【参考方案1】：

您是否尝试过内置的$.fancybox.update() 方法？ the documentation 建议（在 API 方法下）该方法应提供您正在寻找的功能。

【讨论】：

那么我如何将高度传递给那个？

【参考方案2】：

找到了，你要修改以下属性

document.getElementById('fancybox-content').style.height = parseInt(height) + 'px';
document.getElementById('fancybox-frame').height = parseInt(height);