jQuery 和 Colorbox：如何自动设置 iframe 颜色框的高度和宽度
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/10066938/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
jQuery and Colorbox: How to automatically set the height and width of an iframe colorbox
提问by BBKing
I downloaded last version of colorbox jquery plugin. now i set true colorbox for iframe and inline. my problem colorbox(lightbox) not set auto height / width form external page. how to fix this ? There is a way for this?
我下载了最新版本的colorbox jquery 插件。现在我为 iframe 和内联设置了真正的颜色框。我的问题 colorbox(lightbox) 没有设置自动高度/宽度表单外部页面。如何解决这个问题？有办法吗？
MY colorbox function :
我的颜色盒功能：
<script>
$(document).ready(function(){
$(".iframe").colorbox({inline:true,iframe:true});
</script>
Thanks
谢谢
回答by Simon Steinberger
Because colorbox won't know what's inside the iframe, auto resize cannot work the way you expect.
由于 colorbox 不知道 iframe 中的内容，因此自动调整大小无法按您期望的方式工作。
I do it like that: set a default width + height when opening colorbox with these options:
我这样做：使用以下选项打开颜色框时设置默认宽度+高度：
{ iframe: true, innerWidth: 430, innerHeight: 370, scrolling: false, ... }
Select a size, which makes the most sense for your content: colorbox will open and load the iframe into this box. At the end of the iframe's html body, place this little script, which resizes the colorbox from within the iframe:
选择对您的内容最有意义的大小：colorbox 将打开并将 iframe 加载到此框中。在 iframe 的 html body 末尾，放置这个小脚本，它从 iframe 内调整颜色框的大小：
$(function(){
parent.$.colorbox.resize({
innerWidth:$('body').width(),
innerHeight:$('body').height()
});
});
For the second script to work, jQuery must be loaded inside the iframe. Otherwise you have to use native JavaScript to do this task.
要使第二个脚本工作，必须在 iframe 内加载 jQuery。否则，您必须使用本机 JavaScript 来完成此任务。
And make sure, all images inside that iframe have a width/height set or have fully loaded. Otherwise innerWidth/innerHeight will give incorrect values.
并确保该 iframe 内的所有图像都设置了宽度/高度或已完全加载。否则，innerWidth/innerHeight 将给出不正确的值。
