Fancybox - Iframe内容更新fancybox的大小？

Question

在我的网站上，我打开了一个包含IFRAME内容的fancybox。当链接被点击时，是否可以更新fancybox的大小？

例如，我有它设置为535px宽度最初，当特定链接被点击我想要的fancybox调整大小到900px宽度。

任何想法，我可以如何实现这一目标？

谢谢！

Answer 1

我想我只是有同样的问题，在我的情况，fancybox.resize没有工作，但这个工作对我来说：

$("#lightbox").fancybox({ 
    'hideOnContentClick' : true, 
    'width' : 500, 
    'type' : 'iframe', 
    'padding' : 35, 
    'onComplete' : function() { 
    $('#fancybox-frame').load(function() { // wait for frame to load and then gets it's height 
     $('#fancybox-content').height($(this).contents().find('body').height()+30); 
    }); 
    } 
});

信用伊恩灰白色张贴在这里： http://www.ianhoar.com/2011/08/25/jquery-and-fancybox-how-to-automatically-set-the-height-of-an-iframe-lightbox/

Answer 2

$('a', $('#youriframeID').contentDocument).bind('click', function() { 
    preventDefault(); 
    $('#yourIframeID').attr('src', $(this).attr('href')); 
    $('#yourIframeID').load(function() { 
     $.fancybox.resize; 
    }); 
}); 

如果在您的iframe中单击“a”，默认事件将被阻止。相反，我们改变你的iframe的src。加载时，＃.fancybox.resize会自动调整fancybox的内容大小。这是一个想法，所以代码可能还没有工作。只是为了帮助你走上正确的轨道。

Answer 3

对于那些谁可能来这里使用的fancybox 2：

这是对我来说

$(".iframe").fancybox({ 
        autoSize: false, 
        autoDimensions: false, 
        width: 630, 
        height: 425, 
        fitToView: false, 
        padding: 0, 
        title: this.title, 
        href: $(this).attr('href'), 
        type: 'iframe' 
       }); 

工作的代码

Answer 4

这对我的作品上的fancybox v2.1.4

$('#myid').fancybox({ 
    closeBtn : false, 
    padding  : 0, 
    preload  : true, 
    onUpdate : function(){ 
     $.fancybox.update(); 
    } 
});