Colorbox iframe调整大小

时间:2012-02-21 11:55:18

标签: javascript iframe resize colorbox

我看过许多对类似问题的回答,我找不到任何有效的方法。我是javascript的新手,但已经足够让我的结果显示在iframe中,但是当我尝试使用建议的代码时:

$.colorbox({ ... url, iframe true, etc

onComplete : function() { 
        $.fn.colorbox.resize(innerHeight);
        }

窗口调整到150像素高。不管页面的html是什么。理想情况下,它会对搜索结果大小开放,然后我可以在每次运行新搜索时调用它,但我发现的colorbox.resize()的所有变体都没有引用任何内容。纳达。

非常感谢任何帮助。

2 个答案:

答案 0 :(得分:16)

如果您想根据Iframe的内容调整大小,那么您要调整大小的代码应该在Iframe内容中。因为据我所知,只有Iframe知道它包含的内容,而不是加载它的父窗口。 在您的Iframe内容中将此代码放在头部

<script type="text/javascript">
    function Resize_Box(){
        var x = $('body').width();
        var y = $('body').height();
        parent.$.fn.colorbox.resize({
            innerWidth: x,
            innerHeight: y
        });
    }

    $(document).ready(function(){
        Resize_Box();
    });
</script>

当Iframe完全加载时,将执行此代码并调整Colorbox窗口的大小。 (确保此代码仅在您为Parent和Iframe使用相同域时才有效)

答案 1 :(得分:1)

您是否在没有任何争论的情况下尝试resize()?它应该通过自己的自动计算来调整大小。 但你也可以尝试

$.fn.colorbox.resize({innerHeight:innerHeight});

查看此link以获取更多信息。