Bootstrap傳送帶不啓動

我無法啓動Bootstrap傳送帶啓動，也就是輪播。下面是所有與我正在嘗試做的事情有關的代碼。當它在瀏覽器中呈現時，我所看到的只有兩個圖像，一個在另一個之上，並且比它們下面的圖像更小，更大。它只是渲染由HTML定義的DIV，而不是在Carousel中渲染。我驗證了jQuery.ready函數正在被調用，並調用代碼來初始化傳送帶。我也在多個瀏覽器上嘗試過 - IE9，Chrome和Firefox。我正在用盡想法。任何幫助，將不勝感激。謝謝！Bootstrap傳送帶不啓動

<!DOCTYPE html> 

<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
    <title></title> 

    <link type="text/css" href="styles/carousel.css" /> 

    <script type="text/javascript" src="Scripts/jquery-1.7.2.min.js"></script> 
    <script type="text/javascript" src="Scripts/bootstrap-transition.js"></script> 
    <script type="text/javascript" src="Scripts/bootstrap-carousel.js"></script> 

</head> 
<body> 
    <script type="text/javascript"> 

     $(function() { 
      $('#carousel').carousel(); 
     }); 

    </script> 

    <div id="carousel" class="carousel"> 

     <div class="carousel-inner"> 

     <div class="item active"> 
      <img src="images/APM_icon_big.png" alt="Some Alt Text" /> 
      <div class="carousel-caption"> 
      Some caption 
      </div> 
     </div> 

     <div class="item"> 
      <img src="images/appdev_icon_big.png" alt="Some Alt Text" /> 
      <div class="carousel-caption"> 
      Some caption 
      </div> 
     </div> 

     … 

     </div> 

     <a class="carousel-control left" href="#carousel" data-slide="prev">&lsaquo;</a> 
     <a class="carousel-control right" href="#carousel" data-slide="next">&rsaquo;</a> 

    </div> 
</body> 
</html>

來源

2012-07-18 Matthew Snyder

你確定嗎？ 'href =「＃carousel」' – 2012-07-18 12:21:34

當你點擊箭頭時，你是否有任何轉盤行爲？嘗試添加一類「幻燈片」到具有一類輪播的div。你可能會錯過一些CSS。 carousel.css是否包含bootstrap中的一個？ – codemonkey 2012-07-18 13:56:48

我想通了。我的LINK標籤中缺少rel="stylesheet"！

來源

2012-07-23 01:50:02

似乎在這個fiddle

是工作就好了一定要包括通過引導的輪播中定義的樣式：包含在小提琴的CSS來自twitter-bootstrap custom download page只選擇JS組件>旋轉木馬。

將<script>放入<head>或頁面末尾可能並不會造成傷害。

來源

2012-07-18 18:15:48 Sherbrow

我想通了。我在LINK標記中缺少rel =「樣式表」。謝謝你的幫助！ – 2012-07-18 19:03:44

Bootstrap傳送帶不啓動

回答

相關問題