Bootstrap - 傳送帶不起作用。顯示所有圖片但沒有動畫

我是新手，我剛開始學習引導。我現在發現了一個問題，我試圖解決它大約一個小時。我的旋轉木馬畫廊不工作。它一次顯示所有圖片。Bootstrap - 傳送帶不起作用。顯示所有圖片但沒有動畫

這是我的代碼： `

<div class="container-fluid"> 
      <div class="row"> 
       <div class="col-md-12"> 
        <div id="myowncarousel" class="carousel slide"> 
         <ol class="carousel-indicators"> 
          <li data-target="#myowncarousel" data-slide-to="0" class="active"></li> 
          <li data-target="#myowncarousel" data-slide-to="1"></li> 
          <li data-target="#myowncarousel" data-slide-to="2"></li> 
         </ol> 
         <div class="carousel-inner"> 
          <div class="item active"> 
          <img src="img/banner_1.png" alt=""> 
          </div> 
          <div class="item"> 
          <img src="img/banner_2.png" alt=""> 
          </div> 
          <div class="item"> 
          <img src="img/banner_3.png" alt=""> 
          </div> 
         </div> 
         <a class="left carousel-control" href="#myowncarousel" data-slide="prev"> 
         <span class="icon-prev"></span></a> 
         <a class="right carousel-control" href="#myowncarousel" data-slide="next"> 
         <span class="icon-next"></span></a> 
        </div> 
       </div> 
      </div>  
     </div>

` 我會是你的幫助非常感激！

編輯：

<meta charset="utf-8"> 
     <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"> 
     <meta http-equiv="x-ua-compatible" content="ie=edge"> 
     <meta http-equiv="Refresh" content="30" /> 
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-alpha.6/css/bootstrap.min.css" integrity="sha384-rwoIResjU2yc3z8GV/NPeZWAv56rSmLldC3R/AZzGRnGxQQKnKkoFVhFQhNUwEyJ" crossorigin="anonymous"/> 
     <link href="css/style.css" type="text/css" rel="stylesheet"/> 
     </head> 
     <body> 
... 

<script src="https://code.jquery.com/jquery-3.1.1.slim.min.js" integrity="sha384-A7FZj7v+d/sdmMqp/nOQwliLvUsJfDHW+k9Omg/a/EheAdgtzNs3hpfag6Ed950n" crossorigin="anonymous"></script> 
<script src="https://cdnjs.cloudflare.com/ajax/libs/tether/1.4.0/js/tether.min.js" integrity="sha384-DztdAPBWPRXSA/3eYEEUWrWCy7G5KFbe8fFjk5JAIxUYHKkDx6Qin1DkWx51bBrb" crossorigin="anonymous"></script> 
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-alpha.6/js/bootstrap.min.js" integrity="sha384-vBWWzlZJ8ea9aCX4pEW3rVHjgjt7zpkNpZk+02D9phzyeVkE+jo0ieGizqPLForn" crossorigin="anonymous"></script> 
    </body>

這是如何我加載引導文件。我希望沒關係。

來源

2017-04-22 Sebastian

您是否驗證過bootstrap正在您的網站上運行？如果是這樣，你應該檢查項目上的元素，看看是否有一個樣式覆蓋css規則'.carousel-inner> .item {display：none;}'。另外，我不認爲js會觸發，除非你的元素上有'class =「carousel slide」' –

你的代碼很好，如果你正確的加載了js和css文件，它應該工作，所以你可能沒有正確加載東西 – jakob

你在你的進口使用Bootstrap v4，但Bootstrap 3

所以你的HTML代碼，來解決這個問題，你應該：

添加引導3到您的進口
更改您的代碼以引導4

jsfiddle

來源

2017-04-22 18:19:36

哦......非常感謝你。我不知道代碼引導程序3和4之間是否有區別。我現在用你的幫助修復了它。再次感謝你！ – Sebastian

Bootstrap - 傳送帶不起作用。顯示所有圖片但沒有動畫

回答

相關問題