Twitter Bootstrap傳送帶不工作（3.1.1）

我想從Twitter Bootstrap 3.1.1獲得一個簡單的傳送帶工作。我將它簡化爲簡單的通用Bootstrap標記，沒有樣式，但我仍然沒有運氣讓圖像滑動。將不勝感激任何建議。我的標記如下：Twitter Bootstrap傳送帶不工作（3.1.1）

<!DOCTYPE html> 
<html lang="en"> 
    <head> 
    <meta charset="utf-8"> 
    <link rel="stylesheet" type="test/css" href="http://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.1.1/css/bootstrap.css"> 
    <style type="text/css"> 
     .container{ 
     margin: 0 auto; 
     } 
    </style> 
    </head> 

    <body> 
    <div class="container"> 
     <!-- carousel --> 
     <div id="this-carousel-id" class="carousel slide"> 
     <div class="carousel-inner"> 
      <div class="item active"> 
      <img src="images/sample1.svg" alt="" /> 
      <div class="carousel-caption"> 
      </div> 
      </div> 
      <div class="item"> 
       <img src="images/sample2.svg" alt="" /> 
      <div class="carousel-caption"> 
      </div> 
      </div> 
      <div class="item"> 
       <img src="images/sample3.svg" alt="" /> 
      <div class="carousel-caption"> 
      </div> 
      </div> 
     </div> 
     <!-- .carousel-inner --> 
     <!-- next and previous controls here 
      href values must reference the id for this carousel --> 
     <a class="carousel-control left" href="#this-carousel-id" data-slide="prev">&lsaquo;</a> 
     <a class="carousel-control right" href="#this-carousel-id" data-slide="next">&rsaquo;</a> 
     </div> 
     <!-- .carousel --> 
     <!-- end carousel --> 
    </div><!-- /container --> 

    <!-- Javascript--> 
    <script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script> 
    <script>window.jQuery || document.write('<script src="js/jquery-1.7.2.min.js"><\/script>')</script> 
    <!-- Bootstrap jQuery plugins compiled and minified --> 
    <script src="js/bootstrap.min.js"></script> 
    <script> 
     $(document).ready(function(){ 
     $('.carousel').carousel({ 
      interval: 4000 
     }); 
     }); 
    </script> 
    </body> 
</html>

來源

2014-06-13 KPL

確定javascript代碼全部正確加載了嗎？您指向的是相對路徑的js/bootstrap.min.js。你的js目錄與你正在運行的頁面處於同一級別嗎？ – jaapz

謝謝 - 是的，我已將它重定向到：http://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.1.1/js/bootstrap.min.js 現在可以使用。 – KPL

這可能是因爲你沒有指向CDN版本的bootstrap.min.js。

我這樣說是因爲你從CDN位置引用了jquery和css，但是你正在尋找bootstrap.min.js是本地到您的網站。這是你如何配置？

更改爲使用

http://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.1.1/js/bootstrap.min.js

見http://jsfiddle.net/8vvqf/

來源

2014-06-13 12:23:20

就是這樣！修正了它 - 謝謝你！ – KPL

也許你直接打開HTML文件，而不是從一個服務器。然後CDN網址將成爲
file://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js

變化
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
到
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>

，然後再試一次？

來源

2014-06-13 13:08:48 szmtcjm

我試過了，沒有成功。 – KPL

Twitter Bootstrap傳送帶不工作（3.1.1）

回答

相關問題