Twitter Bootstrap旋轉木馬內標籤

我想在Twitter Bootstrap中創建3個選項卡，並且每個選項卡內部都是不同的幻燈片。目前，第一個幻燈片播放，但其他幻燈片不起作用。我意識到這是爲了解決兩者之間的衝突並隱藏內容。我已經看過類似的帖子，但找不到解決方案，並真的很感激任何幫助，以使其運作。Twitter Bootstrap旋轉木馬內標籤

<ul class="nav nav-tabs" id="myTab"> 
    <li class="active"><a href="#industrial">Industrial</a></li> 
    <li><a href="#digital-tech">Digital/Tech</a></li> 
    <li><a href="#finance-professional">Finance/Professional</a></li> 
</ul> 

<div class="tab-content"> 
    <div class="tab-pane active" id="industrial"> 
     <div id="myCarousel1" class="carousel slide"> 
      <div class="carousel-inner"> 
       <div class="active item"><img src="http://placehold.it/350x150&text=1a"></div> 
       <div class="item"><img src="http://placehold.it/350x150&text=1b"></div> 
       <div class="item"><img src="http://placehold.it/350x150&text=1c"></div> 
      </div> 
      <a class="carousel-control left" href="#myCarousel" data-slide="prev"></a> 
      <a class="carousel-control right" href="#myCarousel" data-slide="next">&rsaquo;</a> 
     </div> 
    </div> 

    <div class="tab-pane" id="digital-tech"> 
     <div id="myCarousel2" class="carousel slide"> 
      <div class="carousel-inner"> 
       <div class="active item"><img src="http://placehold.it/350x150&text=2a"></div> 
       <div class="item"><img src="http://placehold.it/350x150&text=2b"></div> 
       <div class="item"><img src="http://placehold.it/350x150&text=2c"></div> 
      </div> 
      <a class="carousel-control left" href="#myCarousel" data-slide="prev"> </a> 
      <a class="carousel-control right" href="#myCarousel" data-slide="next">&rsaquo;</a> 
     </div> 
    </div> 
    <div class="tab-pane" id="finance-professional"> 
     <div id="myCarousel3" class="carousel slide"> 
      <div class="carousel-inner"> 
       <div class="active item"><img src="http://placehold.it/350x150&text=3a"></div> 
       <div class="item"><img src="http://placehold.it/350x150&text=3b"></div> 
       <div class="item"><img src="http://placehold.it/350x150&text=3c"></div> 
      </div> 
      <a class="carousel-control left" href="#myCarousel" data-slide="prev"> </a> 
      <a class="carousel-control right" href="#myCarousel" data-slide="next">&rsaquo;</a>   
     </div> 
    </div> 
</div>

來源

2013-10-30 Hue

我想答案可能會增加以下內容我的頁面： – Hue

認爲你應該數據切換=「標籤」添加到 <li> <a>標籤像

<li><a data-toggle="tab" href="#digital-tech">Digital/Tech</a></li>

黏合和滑塊將工作

來源

2014-06-19 15:36:51 kai

Twitter Bootstrap旋轉木馬內標籤

回答

相關問題