谷歌+关注按钮没有在Firefox中的bootstrap模式中正确显示

时间:2015-02-02 08:32:49

标签: html css twitter-bootstrap google-plus

我有一个bootstrap模式,我有谷歌+跟随按钮它正在谷歌铬合金显示,但没有在Firefox中显示。我尝试放入普通页面并且工作正常,但我希望它在模态框中。

这是我的代码。

    <div class="modal fade" id="sharing_modal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">   
      <div class="modal-dialog">
        <div class="modal-content sharing-wrapper">

          <div class="modal-body sharing-body">
                <img src="/assets/google-round.png" width="80px;" class="img-centered">

            <script src="https://apis.google.com/js/platform.js" async defer></script>

            <div class="g-follow" data-annotation="vertical-bubble" data-height="24" data-href="https://plus.google.com/104729765568883320527" data-rel="publisher"></div>
          </div>

        </div>
      </div>
   </div>

1 个答案:

答案 0 :(得分:3)

问题是风格&#34;显示:无&#34;引导模态。因此,谷歌+关注按钮无法在Firefox中计算正确的大小。

作为一种解决方法,您可以将css样式覆盖为&#34; display:block&#34;然后在页面加载后将其设置回&#34; display:none&#34;。

示例CSS:

#sharing_modal
{
    display: block;
}

示例JS(JQuery):

$( document ).ready(function() {
    $('#sharing_modal').css('display', 'none');
});

请参阅此小提琴:http://jsfiddle.net/rvuqyjf9/1/