2014-09-24 3 views
2

Мне нужно показать fb-share-button в div. Это div изначально скрыты display:none css собственности. В IE, когда кнопка fb-share находится в скрытом div, кнопка не отображается, и когда отображается div, кнопка продолжает скрываться.Facebook share button in hidden div

Я пытаюсь дождаться, что кнопка загружена и спрячет div, но у меня нет успеха.

Это мой код: Master.Page:

<div id="fb-root"> 
</div> 

<script> 

    (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/es_ES/sdk.js#xfbml=1&appId=536816803117001&version=v2.1"; 
     fjs.parentNode.insertBefore(js, fjs); 
    } (document, 'script', 'facebook-jssdk')); 
</script> 

Код для показа содержимого и кнопок:

<div id="SP_PublicacionesCapsula1" class="SP_PublicacionesSeccionOff"> 
       <ul class="SinTipo SinMarginSinPadding"> 
        <% for (Int16 i = 0; i < drInformes.Count; i++) 
         {%> 
        <li class="SP_PublicacionesSeccionItem"> 
         <dl class="SP_PublicacionesSeccionItemTexto"> 
          <dt><a class="SP_PublicacionesTitulo" href="../SalaPrensa/PublicacionesEstudioCasos.aspx?Est_Id=<%=drInformes[i]["Est_Id"].GetInt()%>&Est_Tipo=1" title="enlace a <%=drInformes[i]["Est_Titulo"].GetPublishString(40)%>"> 
           <%=drInformes[i]["Est_Titulo"].GetPublishString()%></a></dt> 
          <dd class="SinMarginSinPadding"> 
           <%=drInformes[i]["Est_Resumen"].GetPublishHtml()%></dd> 
         </dl> 
         <a href="../SalaPrensa/PublicacionesEstudioCasos.aspx?Est_Id=<%=drInformes[i]["Est_Id"].GetInt()%>&Est_Tipo=1" title="acceder a la información completa de <%=drInformes[i]["Est_Titulo"].GetPublishString(40)%>"> 
          <img alt="icono de acceso a la información completa de <%=drInformes[i]["Est_Titulo"].GetPublishString(40)%>" src="../_img/<%=Tools.RecursosCarpeta(this)%>Flecha.png" class="SP_PublicacionesEstudiosFlecha" /></a> 
         <div style="clear: both"> 
          &nbsp;</div> 
         <!--twitter--> 
         <div style="float: left; width: 90px;"> 
          <a href="https://twitter.com/share" class="twitter-share-button" data-lang="en" data-url="<%= GetUrl(drInformes[i]["Est_Id"].GetInt(), 1)%>" data-counturl="<%= GetUrl(drInformes[i]["Est_Id"].GetInt(), 1)%>" data-text="<%=drInformes[i]["Est_Titulo"].GetPublishString()%>">Tweet</a> 
         </div> 
         <!--facebook--> 
         <div style="height: 20px!important; float: left; margin-top: 1px; display: block!important;"> 
          <div class="fb-share-button" data-href="<%= GetUrl(drInformes[i]["Est_Id"].GetInt(), 1)%>" data-type="button_count"> 
          </div> 
         </div> 
        </li> 
        <% }%> 
       </ul> 
      </div> 

Стили для дивы, показывающие уплотнительное Hidding:

.SP_PublicacionesSeccionOff 
{ 
    display:none; 
    float:left; 
    width:529px; 
} 
.SP_PublicacionesSeccionOn 
{ 
    display:block; 
    float:left; 
    width:529px; 
} 

Наконец код JS для отображения или скрыть:

function AbrirDesplegable(Contenedor, SeccionEnlace, Identificador, Flecha) { 

var contenedor = new Object(); 
var desplegable = new Object(); 
var flecha = new Object(); 
var seccion = new Object(); 

contenedor = document.getElementById(Contenedor); 
desplegable = document.getElementById(Identificador); 
flecha = document.getElementById(Flecha); 
seccion = document.getElementById(SeccionEnlace); 

if (desplegable.className == 'SP_PublicacionesSeccionOn') { 
    seccion.className = 'SP_PublicacionesSeccionTextoLinkOff'; 
    flecha.src = '../_img/Flecha[Off].gif'; 
    desplegable.className = 'SP_PublicacionesSeccionOff'; 
} 
else { 
    seccion.className = 'SP_PublicacionesSeccionTextoLinkOn'; 
    flecha.src = '../_img/Flecha[On].gif'; 
    desplegable.className = 'SP_PublicacionesSeccionOn'; 
} 

} 
+0

Можете вы добавить, что у вас есть? – RyPope

ответ

1

Вы, вероятно, нужно разобрать кнопку после того, как сделать видимым:

FB.XFBML.parse(); 

Дополнительная информация: https://developers.facebook.com/docs/reference/javascript/FB.XFBML.parse

Кроме того, убедитесь, что страницы, где вы с помощью социальных плагинов являются общедоступными и не только доступный для защищенных паролем областей.

+0

Я пробовал, и не работает – andriuch

+0

ваша страница живая? - для тестирования и потому, что он ДОЛЖЕН быть живым/общедоступным, чтобы социальные плагины facebook работали правильно. – luschn

+0

Нет, моя страница находится в разработке сайта, но другие кнопки в не скрывать divs работают правильно, и если я запустил страницу на Chrome, кнопки будут показаны. – andriuch