2011-09-04 68 views
4

我有jQuery砌體來佈局我的網站上的列表項,每個列表項都有一個fb:comments。異步加載SDK,甚至將方法「$ container.masonry('reload');」在FB.init()之後,列表項仍然重疊。如何在Facebook社交插件完成加載後加載函數方法?

我在重新加載磚石之前測試了一個警報()框,如果快速關閉警報框,項目仍然重疊,但如果在一段時間後關閉它,它會顯示正確的邊距。所以我假設磚砌重新加載在fb:comments完成加載之前運行。

如何在fb:comments完成加載後觸發砌體重新加載?不通過按鈕點擊。在fb:comments之後,圖像顯示重疊和砌體重新加載。

回答

3

如果使用xfbml版本的插件,則可以訂閱xfbml.render - 在所有插件(調用)完成時觸發。 http://developers.facebook.com/docs/reference/javascript/FB.Event.subscribe/

+0

是的,它添加訂閱後,效果很好,謝謝! –

+0

也爲我工作。如果你想看到我的工作代碼示例,請看這裏:http://stackoverflow.com/questions/5449193/facebook-like-box-load-event-jquery/19295464#19295464 – Tillito

1

按照該FB.Event.subscribe,還有它會自動在頁面將完成渲染插件

觸發加載事件

第1步:在HTML(把它放在你想要的社會盒被示出):

<div class="fb-page" data-href="https://www.facebook.com/facebook" data-small-header="true" data-adapt-container-width="true" data-hide-cover="false" data-show-facepile="true"><div class="fb-xfbml-parse-ignore"><blockquote cite="https://www.facebook.com/facebook"><a href="https://www.facebook.com/facebook">Facebook</a></blockquote></div></div> 

步驟2:在頁腳(結束<body>標籤之前):

<div id="fb-root"></div> 
<script> 
window.fbAsyncInit = function(){ 
    //FB.init({ status: false, cookie: true, xfbml: true }); 
    FB.Event.subscribe("xfbml.render", function(){ 
     SocialBoxesLoaded(); //-->this is what we want (any custom Function) :) 
    }); 
}; 
(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.8"; 
fjs.parentNode.insertBefore(js, fjs); 
}(document, 'script', 'facebook-jssdk')); 

function SocialBoxesLoaded(){ 
    //...Your Custom Code... 
} 
</script> 
相關問題