最初隐藏facebook插件

时间:2015-03-09 09:35:15

标签: javascript jquery facebook

我有一个简单的.share-toggle切换链接。当你点击它时,facebook评论插件应该显示。它应该是最初隐藏的问题是,如果我使用css隐藏它,并且我单击切换,FB注释插件不会显示。所以我只想在加载下面的代码之后隐藏FB插件......仍然没有运气。它只有在我不隐藏插件时才有效。

      var isLoaded = false;
  window.fbAsyncInit = function() {
    FB.init({
      channelUrl : '#', // Channel File
      status     : true, // check login status
      cookie     : true, // enable cookies to allow the server to access the session
      xfbml      : true  // parse XFBML
    });
    $('#fb-root').trigger('facebook:init');

    // Additional initialization code here
  };

  // Load the SDK Asynchronously
  (function(d){
     var js, id = 'facebook-jssdk', ref = d.getElementsByTagName('script')[0];
     if (d.getElementById(id)) {return;}
     js = d.createElement('script'); js.id = id; js.async = true;
     js.src = "//connect.facebook.net/en_US/all.js";
     ref.parentNode.insertBefore(js, ref);
   }(document));

    $("#fb-root").bind("facebook:init", function() {
        console.log('loaded');
        $('.social-sharing').hide();
    });

    $('.share-toggle').on('click', function() {
        $(this).parent().find('.social-sharing').slideToggle('fast');
    }); 

1 个答案:

答案 0 :(得分:1)

确保隐藏正确的容器。

如果您的Facebook社交工具呈现为.share-toggle并且您已使用您的css将此元素设置为display:none,那么Facebook代码可能会在加载后删除此css属性。

所以你应该做的是将你的社交元素包装到一个容器中。

<div class="social-container" style="display:none">
    <div class="social-sharing"></div>
</div>

通过这种方式,您可以轻松切换容器以显示或隐藏社交窗口小部件。

$('.share-toggle').on('click', function() {
    $('body').find('.social-container').slideToggle('fast');
});