引導滑塊不會自動啓動

**我已經看到了一些有用的解決方案，爲其他人工作..在我的標籤中實現它們..記下順序但仍然我的傳送帶滑塊不會自動啓動？誰能幫忙？請參見下面的代碼：**引導滑塊不會自動啓動

 <!DOCTYPE html> 
     <html lang="en"> 
     <head> 
      <title>Movie search App</title> 

     <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.6/angular.min.js"></script> 

     <script type="text/javascript" src="js/custom.js">

<!-- Bootstrap Core JavaScript -->

 </head> 




      <div id="myCarousel" class="carousel slide"> 
        <!-- Indicators --> 
        <ol class="carousel-indicators"> 
         <li data-target="#myCarousel" data-slide-to="0" class="active"></li> 
         <li data-target="#myCarousel" data-slide-to="1"></li> 
         <li data-target="#myCarousel" data-slide-to="2"></li> 
        </ol> 

        <!-- Wrapper for Slides --> 
        <div class="carousel-inner"> 
         <div class="item active"> 
          <!-- Set the first background image using inline CSS below. --> 
          <div class="fill" style="background-image:url('img/1.jpg');"></div> 
          <div class="carousel-caption"> 
           <h2>Caption 1</h2> 
          </div> 
         </div> 
         <div class="item"> 
          <!-- Set the second background image using inline CSS below. --> 
          <div class="fill" style="background-image:url('img/3.jpg');"></div> 
          <div class="carousel-caption"> 
           <h2>Caption 2</h2> 
          </div> 
         </div> 
         <div class="item"> 
          <!-- Set the third background image using inline CSS below. --> 
          <div class="fill" style="background-image:url('img/4.jpg');"></div> 
          <div class="carousel-caption"> 
           <h2>Caption 3</h2> 
          </div> 
         </div> 
        </div> 

        <!-- Controls --> 
        <a class="left carousel-control" href="#myCarousel" data-slide="prev"> 
         <span class="icon-prev"></span> 
        </a> 
        <a class="right carousel-control" href="#myCarousel" data-slide="next"> 
         <span class="icon-next"></span> 
        </a> 

      </div> 
</html> 


     //jquery 
//for carousel customjs it is the slider part code in custom.js 


      var $ = jQuery.noConflict(); 
       $(document).ready(function() { 
        $('#myCarousel').carousel({ interval: 200, cycle: true }); 
       });

來源

2017-05-28 Mirthful Nahid

您是否將'bootsrap.js'和'bootstrap.css'鏈接到您的html中 – AdhershMNair

引導JS和CSS缺失。將這些JS和CSS鏈接到標題中。它會解決你的問題。

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"> 
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> 
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" ></script>

來源

2017-05-28 05:53:36 AdhershMNair

試試這個

<!DOCTYPE html> 
     <html lang="en"> 
     <head> 
      <title>Movie search App</title> 



     <script type="text/javascript" src="js/custom.js"></script> 
      <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"> 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> 
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> 
     <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.6/angular.min.js"></script> 
     </head> 




      <div id="myCarousel" class="carousel slide"> 
        <!-- Indicators --> 
        <ol class="carousel-indicators"> 
         <li data-target="#myCarousel" data-slide-to="0" class="active"></li> 
         <li data-target="#myCarousel" data-slide-to="1"></li> 
         <li data-target="#myCarousel" data-slide-to="2"></li> 
        </ol> 

        <!-- Wrapper for Slides --> 
        <div class="carousel-inner"> 
         <div class="item active"> 
          <!-- Set the first background image using inline CSS below. --> 
          <img src="img/1.jpg" alt="" style="width:100%;"> 
          <div class="carousel-caption"> 
           <h2>Caption 1</h2> 
          </div> 
         </div> 
         <div class="item"> 
          <!-- Set the second background image using inline CSS below. --> 
          <img src="img/3.jpg" alt="" style="width:100%;"> 
          <div class="carousel-caption"> 
           <h2>Caption 2</h2> 
          </div> 
         </div> 
         <div class="item"> 
          <!-- Set the third background image using inline CSS below. --> 
          <img src="img/4.jpg" alt="" style="width:100%;"> 
          <div class="carousel-caption"> 
           <h2>Caption 3</h2> 
          </div> 
         </div> 
        </div> 

        <!-- Controls --> 
        <a class="left carousel-control" href="#myCarousel" data-slide="prev"> 
         <span class="icon-prev"></span> 
        </a> 
        <a class="right carousel-control" href="#myCarousel" data-slide="next"> 
         <span class="icon-next"></span> 
        </a> 

      </div> 
</html>

，而不是在CSS設置的圖像，你應該使用<img>標籤。

來源

2017-05-28 06:01:36

引導滑塊不會自動啓動

回答

相關問題