6

我有 jQuery masonry 来布局我网站上的列表项,每个列表项都有一个 fb:comments。异步加载SDK,甚至把方法“$container.masonry('reload');” 在 FB.init() 之后,列表项仍然重叠。

我测试了在重新加载砌体之前放置一个警报()框,如果快速关闭警报框,项目仍然重叠,但如果在一段时间后关闭它,它会正确显示边距。所以我假设砌体重新加载在 fb:comments 的内容完成加载之前运行。

在 fb:comments 的内容加载完成后如何触发砌体重新加载?不是通过按钮单击。图像显示它何时重叠并在 fb:comments 后重新加载砌体。

4

2 回答 2

3

如果您使用插件的 xfbml 版本,您可以订阅 xfbml.render - 在所有插件(调用)完成时触发。 http://developers.facebook.com/docs/reference/javascript/FB.Event.subscribe/

于 2011-09-04T19:11:39.553 回答
2

根据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>
于 2016-11-11T20:36:49.920 回答