2012-02-10 48 views
11

Không chắc chắn tại sao plugin hoạt động theo cách này nhưng bất cứ khi nào tôi làm mới trang bằng plugin băng chuyền, div chứa trống sẽ như sau 5 giây thì băng chuyền sẽ bắt đầu hoạt động bình thường- -sliding qua.Twitter Bootstrap Carousel trì hoãn plugin khi tải trang

Tôi đã tạo một phiên bản rút gọn chỉ để xem liệu có những thứ khác cản trở mọi thứ hay không. Dưới đây là những gì tôi có:

<html> 
    <head> 

     <link rel="stylesheet" href="bootstrap.min.css" type="text/css"> 
     <link rel="stylesheet" href="css/carousel.css" type="text/css"> 

     <script type="text/javascript" src="scripts/jquery-1.7.1.min.js"></script> 

     <script type="text/javascript" src="scripts/bootstrap-transition.js"></script> 
     <script type="text/javascript" src="scripts/bootstrap-carousel.js"></script> 

     <script type="text/javascript"> 
      $(function() { 
       $('#myJumbotron').carousel(); 
      }); 

     </script> 

    </head> 

    <body> 

     <!-- JUMBOTRON 
===================================================================== --> 
     <div class="container"> 
      <div class="row"> 
       <section class="span16"> 

        <div id="myJumbotron" class="carousel"> 
         <div class="carousel-inner"> 

          <div class="item"> 
           <img src="images/jumbotron.jpg" alt="Featured specials" /> 
          </div> 

          <div class="item"> 
           <img src="http://placehold.it/940x380" alt="Featured specials" /> 
          </div> 

          <div class="item"> 
           <img src="images/jumbotron.jpg" alt="Featured specials" /> 
          </div> 

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

       </section> 
      </div> 
     </div> 

    </body> 

</html> 

tôi sử dụng công cụ SimpLESS để chỉ biên dịch các tập tin carousel.less đến file carousel.css riêng của mình và các bootstrap.min.css là chưa sửa đổi là tốt.

Bạn có thể xem điều gì đang xảy ra khi đến đây: furnitureroadshow.com. Bất kỳ trợ giúp về điều này sẽ được nhiều đánh giá cao.

Trả lời

31

thêm cho hạng mục hạng nhất "hoạt động" trong html, bây giờ bạn đang đợi 1 chu kỳ.

EX:

     <div class="item active"> 
          <img src="images/jumbotron.jpg" alt="Featured specials" /> 
         </div> 

         <div class="item"> 
          <img src="http://placehold.it/940x380" alt="Featured specials" /> 
         </div> 
...... 
+3

Thanx. Những thứ như thế này bị bỏ qua sau 10 giờ mã hóa. LOL. – generalopinion

Các vấn đề liên quan