Question

我基本上遇到了与此主题相同的问题（http://stackoverflow.com/questions/9662576/social-media-buttons-inside-hidden-div）但是因为海报在分享之前报废了代码希望有人能有解决方案。

我正在隐藏的div中加载一组社交媒体图标，这些图标在悬停时变得可见。问题似乎是，当Follow按钮加载到隐藏的div中时，它不会附加@username，而只是显示“Follow”。

任何帮助都将受到高度赞赏！

这应该为您重现问题;

HTML：

<li><a class="menu">Menu Item</a>
<ul id="blah-menu">
<a href="https://twitter.com/twitter" class="twitter-follow-button" data-show-count="false" data-dnt="true">Follow @twitter</a>
<script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0];if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src="//platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");</script>
</ul>
</li>

CSS：

nav li ul#blah-menu {
display: none;
z-index: 99999 !important;
}

nav li:hover ul#blah-menu {
display: block;
height: auto;
position: absolute;
z-index: 1;
}

Answer 1

我最后在页脚的某处显示了1x1（和溢出：隐藏）div包装器，其中有按钮代码，然后当按钮应该显示时，只需将包装器移动到所需位置并设置溢出：可见

Answer 2

我有类似的问题。我用setinterval来推它。

var twitterListener = setInterval(function(){
  if(jQuery("#yourDiv").is(":visible")){
    clearInterval(twitterListener)
    if (typeof window.twttr == "undefined") {
      window.twttr = (function (d,s,id) {
          var t, js, fjs = d.getElementsByTagName(s)[0];
          if (d.getElementById(id)) return; js=d.createElement(s); js.id=id;
          js.src="https://platform.twitter.com/widgets.js";
          fjs.parentNode.insertBefore(js, fjs);
          return window.twttr || (t = { _e: [], ready: function(f){ t._e.push(f) } });
      }(document, "script", "twitter-wjs"));
    }

    twttr.ready(function (twttr) {
        twttr.events.bind('click', function (event) { 
          //
        });
        twttr.events.bind('follow', function(event) {
            //
        });
        twttr.events.bind('tweet', function(event) {
            //
        });        
    }); 
  }
},10)

在隐藏的div中加载Twitter Follow按钮

2 个答案: