如何在Twitter Bootstrap下拉列表中列出两个Linkedin跟随按钮 [英] How can I list two Linkedin Follow Buttons in a Twitter Bootstrap Dropdown

问题描述

一段时间以来，我一直对此感到困惑... http://jsfiddle.net/ravenna/GFydL/7/

I have been messing with this for awhile... http://jsfiddle.net/ravenna/GFydL/7/

<div class="dropdown">
  <a class="dropdown-toggle" data-toggle="dropdown" href="#">Dropdown trigger</a>
  <ul class="dropdown-menu" role="menu" aria-labelledby="dLabel">
      <li>Test</li>
      <li>
       <script type="IN/FollowCompany" data-id="621453" data-counter="right"></script>   

      </li>
  </ul>
</div> 

我所拥有的是多个下拉菜单，每个下拉菜单代表一个用户个人资料.如果用户已向我们归档了Linkedin个人资料，则下拉菜单中会显示一个关注"按钮.

What I have is multiple drop-downs that each represent a user profile. If the user has a Linkedin Profile on file with us then a follow button is visible for their dropdown.

所有浏览器都显示第一个浏览器，而chrome显示第二个浏览器就很好. FF和IE仅在第二个及以后的图标中显示一小部分.知道如何在关注"按钮中看到任意数量的链接吗?

All browsers show the first one, and chrome shows the second one just fine. FF and IE only show a sliver of the icon for the 2nd and any more. any idea how to see any number of linked in Follow buttons?

推荐答案

首先，我发现按钮加载有时会变慢，因此您可以在按钮加载之前打开下拉列表.

First i found the buttons load slow sometimes so you could open the drop-down before your buttons loads.

我无法在IE上进行测试.我找到了一个解决方案的Firefox. Linkedin API(js)在跨度(或类似范围)内的跨度中的iframe中的iframe中加载div.我发现按钮iframe加载了，但是宽度只有2px. 2 px的宽度似乎是由ul.dropdown-menu的display:none引起的.我的解决方案是将显示替换为可见性，以便div有足够的空间:

I couldn't test on IE. I found a solution for firefox. The linkedin api (js) loads a div in a iframe in a iframe in a span in a span (or something like) that. I found the button iframes load but got a width of only 2px. The 2 px width seems to be caused by the display:none of the ul.dropdown-menu. My solution replace the display with visibility so the div got space:

 ul.dropdown-menu
 {
 display: block; visibility: hidden;
 }  

.open > .dropdown-menu
{
visibility: visible;
}   

请参阅: http://jsfiddle.net/bassjobsen/dsasu/1/

除了可见性，您还可以将内容加载到其他地方，并在第一次单击时将其复制到下拉菜单中.

Instead of the visibilty you also could load the content elsewhere with space and copy it to the dropdown on first click.

这篇关于如何在Twitter Bootstrap下拉列表中列出两个Linkedin跟随按钮的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！