Question

我正在使用活动源的html5嵌入代码，如下所示：

http://developers.facebook.com/docs/reference/plugins/activity/

我希望Facebook活动流能够“填充”它的封闭盒子。这个封闭的盒子是可调整大小的，所以当调整封闭盒的大小时，我需要调整该活动流的大小。

Answer 1

Activity Feed插件使用iframe进行渲染，无法使用纯CSS调整其大小。但是使用javascript，您可以通过使用正确的高度作为参数重新加载iframe来调整插件的大小。这是一种更快的方法，然后再次解析XFBML标记。

CSS （确保插件元素遵循容器大小）

.fb-activity, .fb-activity * {
    position:relative !important;
    width:100% !important;
    height:100% !important;
}

Javascript （使用jQuery）

$(window).resize(function() {

    //Calculate the new height of your container
    //...

    var $container = $('.container');
    var $iframe = $container.find('iframe');
    $container.css('height',containerHeight+'px');
    if($iframe.length) {
        $iframe.attr('src',$iframe.attr('src').replace(/height=[0-9]+/gi,'height='+escape(containerHeight)));
    } else {
        $container.find('.fb-activity').attr('data-height',containerHeight);
    }
});

我可以动态调整Facebook Activity Stream插件的大小吗？

1 个答案: