2014-04-10 23 views
1

活动图像正在显示,但之后没有任何反应。我是Bootstrapper的新手,所以我希望有人能让我知道我是否缺少库,或者必须错误。我环顾四周,一切似乎都正确?Twitter Bootstrap旋转木马不旋转图像

 <head> 
      <meta charset="utf-8"> 
      <link href="css/bootstrap.min.css" rel="stylesheet" media="screen"> 
      <link rel="stylesheet" href="css/bootstrap-responsive.css"> 

      <title></title> 
      <meta name="viewport" content="width=device-width, initial-scale=1.0"> 

     </head> 
     <body> 
      <div class="container"> 
       <div class="navbar navbar-fixed-top"> 
        <div class="navbar-inner"> 
         <div class="container"> 
         <a class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse"> 
         <span class="icon-th-list"></span></a> 
         <a href="#" class="brand">California Autism Center & Learning Group</a> 
         <div class="nav-collapse collapse"> 
          <ul class="nav pull-right"> 
           <li class="active"><a href="#">Home</a></li> 
           <li><a href="#">About</a></li> 
           <li><a href="#">Contact</a></li> 
           <li><a href="#">Services</a></li> 
           <li><a href="#">Our Staff</a></li> 
          </ul> 
          </div> 
         </div> 
        </div> 
       </div> 
       <div class="hero-unit"> 
        <div id="myCarousel" class="carousel slide"> 
         <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> 
         <!-- Carousel items --> 
         <div class="carousel-inner"> 
          <div class="active item" alt=""><img src="img/Banner.jpg"/></div> 
          <div class="item" alt=""><img src="img/autism1.jpg"/></div> 
          <div class="item" alt=""><img src="img/autism2.jpg"/></div> 
         </div> 
         <!-- Carousel nav --> 
         <a class="carousel-control left" href="#myCarousel" data-slide="prev">&lsaquo;</a> 
         <a class="carousel-control right" href="#myCarousel" data-slide="next">&rsaquo;</a> 
        </div> 
       </div> 
       <div class="row-fluid"> 
        <div class="span8"> 
        <h3>How We Started</h3> 
         <p>Add information here.</p> 
        <h3>Our Goals</h3> 
         <p>Add nformation here.</p> 
        </div> 
       </div> 
       <hr> 
     <div class="container"> 
     <div class="row-fluid"> 
      <div class="span4"> 
       <p>&copy; 2013 <a href="#"></a></p> 
      </div> 
      <div class="span4 text-center"> 
       <ul class="nav inline"> 
        <li><a href="#">About Us</a></li> 
        <li><a href="#">Contact Us</a></li> 
        <li><a href="#">Privacy Policy</a></li> 
       </ul> 
      </div> 
      <div class="span4 text-right"> 
       <p></p> 
      </div> 
     </div> 
    </div> 

      </div> 


      <script src="//code.jquery.com/jquery-1.10.0.min.js"></script> 
      <script src=”js/bootstrap.js”></script> 
     </body> 
    </html> 

my .js code: 

    $(document).ready(function() {   
      $('#myCarousel').carousel({ 
       interval: 2000 
      }) 

     }); 
+1

你在哪里放置你的js代码?这个必须比你的js代码优先。 – dippas

+0

我不确定它是否真的需要,但试着用'$('#myCarousel')来启动它''carousel('cycle');' – conceptdeluxe

+0

我试过#myCarousel没有运气,所以dippas指出它可能成为我有脚本的订单的问题。我将更新并重试。谢谢! – Bacon2305

回答

0

我创建从你的代码Fiddle和正常工作(旁边的事实,即图像占位符404)。我的猜测是,这个问题是在这些报价您使用此:

<script src=”js/bootstrap.js”></script> 

我的Chrome doesnt't治疗那些正常报价和事实,这条线变为:

<script src="”js/bootstrap.js”"></script> 
0

之前,试试这个关闭车身标签。它适用于我在BS2上使用& 3.

<script> 
    $('.carousel').carousel({ 
    pause:false, 
    interval:7000 
    }) 
</script>