Скрыть плагин facebook изначально

Question

У меня есть простая .share-toggle toggle link. Когда вы нажимаете на него, должен появляться плагин комментариев к facebook. Он должен быть скрыт initally. Проблема заключалась в том, что если я скрою его с помощью 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'); 
    }); 

Answer 1

Убедитесь, что вы скрываете правый контейнер.

Если ваш социальный инструмент facebook отображается .share-toggle, и вы установили этот элемент в display:none с помощью css, код 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'); 
});