Facebook評論插件

Question

我正在使用 Facebook XML 在我的 MVC 3 應用程序中加載 Facebook 評論插件，如下所示：

<fb:comments href="@Request.Url.AbsoluteUri" num_posts="15" width="900"></fb:comments>

問題是寬度屬性僅以像素值呈現。 我想指定一個百分比寬度。 我檢查了 Facebook 的 JavaScript 將 XML 標記呈現為完全限定的 HTML 時生成的 HTML。 它吐出一個帶有指定寬度的內聯 css 的 iframe。 iframe 有一個類“fb_ltr”，我嘗試為 .fb_ltr 做一個 CSS 規則來改變寬度，但因為 css 作為style=""屬性內聯，這個規則被覆蓋。

然后我嘗試使用 jQuery：

$(function()
{
    $('.fb_ltr').css('width', '100%');
});

但這也不起作用，因為 Facebook JavaScript 需要一段時間來完成它的工作並呈現內容。 有沒有人以前使用過 Facebook 插件？ 自定義似乎有點復雜。 在 Facebook 腳本渲染出評論 iframe 之后，有沒有辦法綁定一些 jQuery？

Answer 1

如果你可以通過 css 做到這一點，為什么不這樣做呢？ 只需添加 !important 它將覆蓋所有內容。 但我懷疑你是否可以通過 css 來做到這一點。 示例CSS：

width: 100% !important;

Answer 2

嘗試將load事件附加到 facebook 框架：

$("#comments").load( function() {
    $('.fb_ltr').css('width', '100%');
});

Answer 3

我改變了這個：

<fb:comments href="http://whatever.com" 
num_posts="10" width="500"></fb:comments>

對此：

<fb:comments href="http://whatever.com" 
num_posts="10" width="100%" style="width:100%"></fb:comments>

並設置以下css：

iframe.fb_ltr { width:100% !important; }

有效...