1

我正在尝试以 Facebook 代码的百分比（80%）设置宽度。这不起作用！首先我尝试通过 css 但没有任何改变。它始终是默认的 Facebook 宽度（大约 500 像素）。

<div id="fb-root" style="width: 80%"></div>
<script src="http://connect.facebook.net/it_IT/all.js#xfbml=1"></script>
<fb:comments href="http://stackoverflow.com" num_posts="5" width="auto"></fb:comments>

因此，我决定使用 javascript 并在用户调整浏览器窗口大小时更改其宽度。所以，如果我的屏幕宽度是 1000px，它必须是 1000px。但是当我将浏览器窗口的大小调整为 756px 时，它必须通过 Javascript 在 fb:comments 的 width="..." 上更改为 756px。错误来自 Firebug (Firefox 8): box[0] is undefined -> var boxwidth = box[0].getAttribute("width");。

<script type="text/javascript">
    var box = document.getElementsByTagName("fb:comments");
    var boxwidth = box[0].getAttribute("width");

    alert("start...");
    alert("width of element 'box': "+boxwidth);
    alert("...end");

    /*resolution = screen.width;
    alert("Screen width: "+resolution);*/
</script>

有没有办法动态设置 fb:comments 的宽度？提前致谢。再见，戴维德。

PS。对不起我的英语错误，如果我这样做了......

4

4 回答 4

5

显然不再支持fb:comments css 属性！

fb:comments 的宽度必须始终以像素为单位。我不太确定您在寻找什么，但我希望这可能有助于您顺利上路。

在您的 html 中，创建一个 div：

<div id="fbcomment">
</div>

在您的脚本标签之间，使用这段 jquery 代码并将正文选择器替换为您要计算 80% 折扣的元素。

$(document).ready(function(){

    width_percent = $('body').width() * 0.8;
    fbxml = '<fb:comments href="http://stackoverflow.com" num_posts="5" width="' + width_percent  + 'px"></fb:comments>';

    $('#fbcomment').append(fbxml);
});

这是一个工作示例：http: //jsfiddle.net/CZpx2/3

这是一个令人讨厌的解决方法，它有它的局限性，但在某些情况下它可以解决问题。希望它对你有用！

于 2011-12-05T13:36:59.993 回答
4

怎么样（如果您使用的是最新的 Facebook 评论代码）：

.fb-comments iframe, .fb-comments, .fb-comments span { width:100% !important; }
于 2012-06-08T10:18:37.883 回答
1

在 CSS 中你可以尝试添加一个 !important:

fb:comments {
  width:80% !important;
}

并使用 jQuery：

jQuery(document).ready( function () {
  $('fb:comments').css('width', '100%');
})
于 2011-12-03T00:32:04.357 回答
0

很简单，我认为这个问题已经被问到旧的 fb 评论插件，现在你可以添加data-width一个值为 的属性100%，给它父宽度。

第1步

标记后按照fb docsbody中的说明放置 js 代码

<div id="fb-root"></div>
<script>
  (function(d, s, id) {
    var js, fjs = d.getElementsByTagName(s)[0];
    if (d.getElementById(id)) return;
    js = d.createElement(s); js.id = id;
    js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.8appId=**YOUR_APP_ID**";
    fjs.parentNode.insertBefore(js, fjs);
  }(document, 'script', 'facebook-jssdk'));
</script>

用 facebook 生成的 appID 替换 YOUR_APP_ID

第 2 步 在一个块标签内可能是一个div标签给它一个宽度，并把它放在里面：

<div class="fb-comments" data-href="YOUR_URL" data-numposts="10" data-width="100%"></div>

将 YOUR_URL 替换为您的网站页面 url，您还可以更改帖子显示的数量。

于 2016-10-21T16:36:36.180 回答