如何使fancybox调整大小以自定义创建的iframe大小

时间:2012-08-30 04:48:52

标签: jquery fancybox

我想让fancybox尺寸与“手动创建的”iframe的内容大小相匹配。

我试过这个:http://jsfiddle.net/ystLD/3/

但它不起作用,现在我有点被困在这里。

有谁知道怎么做?

感谢。

2 个答案:

答案 0 :(得分:5)

A"手动创建" iframe的缺点是fancybox并不真正知道type内容正在处理什么。我宁愿用type: "iframe"选项打开fancybox。

然后,根据iframe的内容,我认为您可以重新调整fancybox大小的唯一方法是对iframe中打开的页面内的维度进行硬编码,或者{ {1}},html或类似

的包装容器
body

然后您可以使用<html style="width: 800px; height: 650px;"> 回调来获取beforeShow的尺寸

iframe

如果您不拥有已打开的页面,并且无法对其维度进行硬编码,那么您仍然可以尝试获取 beforeShow: function(){ this.width = $('.fancybox-iframe').contents().find('html').width(); this.height = $('.fancybox-iframe').contents().find('html').height(); } 或{{innerWidth()的{​​{1}}和innerHeight() 1}}标签,但它可能真的很多,你可以在这个forked fiddle

中看到

以下是适用于其他人的答案https://stackoverflow.com/a/10776520/1055987

答案 1 :(得分:0)

您可以将宽度和高度附加到iframe的属性,因为无论如何都要手动创建它。

.attr({ name: 'blah', width: '500px', height: '500px' })

如果你想要一些与你正在获取的页面大小完全匹配的东西,那么这是一项相当繁琐的工作,因为iframe就像打开浏览器窗口一样。您必须通过分析结构以编程方式确定最宽div的大小。此外,您必须确定该页面是否使用响应式布局并使用特定大小。