Facebook的评论插件有几个问题

Question

我在此页面上有一个Facebook评论框：http://8wayrun.tv/

<div class="fb-comments" data-href="http://8wayrun.tv"
    data-width="100%" data-numposts="20" data-order-by="reverse_time"></div>

我对此评论框有3个问题。

1

如果您转到该页面，您会看到Facebook评论框隐藏在标签后面。由于选项卡在页面加载时默认隐藏，因此注释框代码中的data-width="100%"属性会强制框的宽度为0像素宽;因为100％的隐藏是0px。如果你转到这里：http://8wayrun.tv/#facebook，一个强制Facebook标签首先打开的链接，你会看到它加载完全正常......但问题1导致问题2 ......

2

该框没有响应。我的整个页面都很敏感。当您调整页面大小时，各种元素的宽度会随之调整...除了Facebook框。似乎在JS加载和放置盒子的那一刻，FB硬编码特定大小的宽度，它永远不会被改变。是否有一种快速简便的方法使FB注释框符合我的页面的响应性？

3

如何设置评论框的高度？它似乎没有拉伸我页面的高度。

PS

有没有办法让FB评论框自动更新？那么它可以更多地用作聊天室而不是评论框吗？

Answer 1

使用以下代码解决问题1和2：

$(window).resize(function(e) { resizeFacebookComments(); });
$('#fbtab').click(function(e) { resizeFacebookComments(); });

function resizeFacebookComments()
{
    var src   = $('.fb-comments iframe').attr('src').split('width='),
        width = $('#facebook .inner').width()-18;

    $('.fb-comments iframe').attr('src', src[0] + 'width=' + width);
}