Карусель не работает в twitter bootstrap 2.3.2

Я создаю сайт, используя twitter bootstrap 2.3.2, в котором у меня есть карусель. Но карусель не скользит, я добавил скрипт java для карусели, но я не знаю, чего не хватает.Карусель не работает в twitter bootstrap 2.3.2

Скажите, пожалуйста, что я делаю неправильно?

Вот код, что я делаю:

<html> 

    <head> 
    <meta charset="utf-8"> 
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> 
    <title> 
     ExampleWebsite1 
    </title> 
    <meta name="description" content=""> 
    <meta name="viewport" content="width=device-width"> 





    <link href="http://getbootstrap.com/2.3.2/assets/css/bootstrap.css" rel="stylesheet"> 
    <link href="http://getbootstrap.com/2.3.2/assets/css/bootstrap-responsive.css" rel="stylesheet"> 



    <script src="js/vendor/modernizr-2.6.2-respond-1.1.0.min.js"> 
    </script> 

    <script type="text/javascript"> 
    $(document).ready(function() { 
     $('.dropdown-toggle').dropdown(); 
    }); 


        <style> 

         .carousel .item { 
    width: 100%; /*slider width*/ 
    max-height: 900px; /*slider height*/ 
} 
.carousel .item img { 
    width: 100%; /*img width*/ 
} 
/*add some makeup*/ 
.carousel .carousel-control { 
    background: none; 
    border: none; 

} 
/*full width container*/ 
@media (max-width: 767px) { 
    .block { 
     margin-left: -20px; 
     margin-right: -20px; 
    } 
} 

        <style> 
         body{ 
         background-color: #232323; 
         } 
         </style> 



         <style type="text/css"> 
         h1 { 

         text-decoration: underline; color: #c00; 


         } 
         h1 span{ color: #00A2E8 
         } 
         h1{font-weight: bold;} 

         h1{font-size: 30px;} 

         </style> 

         <style> 
         .navbar-inner{ 
         height: 80px; 
         } 
         </style> 




    </head> 

         <body> 


         <nav class="navbar navbar-inverse 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-bar"></span> 
         <span class="icon-bar"></span> 
         <span class="icon-bar"></span> 
         </a>      
         <a class="brand" href="#"><img class="img-responsive" src="D:\Image\nyuralsimage.png"></a>   


         <div class="nav-collapse collapse"> 
         <ul class="nav pull-right" id="top-nav">      

         <li class="dropdown"><a class="dropdown-toggle" data-toggle="dropdown" href="#section1">STUDIO<b class="caret"></b></a> 
         <ul class="dropdown-menu"> 
         <li><a href="#">Team</a></li> 
         <li><a href="#">Clients</a></li> 
         </ul> 
         </li> 
         <li><a href="#section2">SERVICES</a></li> 
         <li><a href="#section3">CONTACT</a></li> 
         <li><a href="#section4">SOCIAL CONNECT</a></li> 



        </ul> 

        </div> 
        </div> 
        </div> 
        </nav> 




        <section class="block"> 
        <div id="myCarousel" class="carousel slide"> 
         <div class="carousel-inner"> 
          <div class="item active"> 
           <img src="D:/Image/slide1copy.jpg" alt="Slide1" /> 
          </div> 
          <div class="item"> 
           <img src="http://lorempixel.com/1024/750" alt="Slide2" /> 
          </div> 
          <div class="item"> 
           <img src="D:/Image/slide3copy.jpg" alt="Slide3" /> 
          </div> 
         </div> 

         <a class="left carousel-control" href="#myCarousel" data-slide="prev">‹</a> 
         <a class="right carousel-control" href="#myCarousel" data-slide="next">›</a> 
        </div> 
        </section> 

    <script src="js/jquery-1.8.3.min.js"></script>           
        <script src="js/bootstrap.min.js"></script> 

         <script src="js/plugins.js"> 
        </script> 
         <script src="js/main.js"> 
        </script> 


         <script> 
         $('#top-nav').onePageNav({ 
         currentClass: 'active', 
          changeHash: true, 
          scrollSpeed: 1200 
         } 
        ); 
         </script> 

     </body> 
     </html>

Спасибо.

источник

2013-11-29 user2890202

здесь у есть записать его в виде $ (документ) .ready (функция() {} просто удалить этот и попробовать –

я уже попробовать это, но он не работает .. – user2890202

Вы можете обновить код –

Попробуйте это прямо сейчас

Здесь и можно писать только

<img ....>

Но и нужно написать фонового-образ в стиле

 <div class="item active"> 
      <div style="background-image: url('img/slideImg/1.png');" 
       class="fill"></div> 
      <div class="carousel-caption"> 
       <h1>Ready to Style &amp; Add Content</h1> 
      </div> 
     </div> 
    </div>

и после caruosel закрытия сНа затем u может и должен написать ниже код

<script type="text/javascript"> 
     $('.carousel').carousel({ 
      interval: 5000 
     }); 
    </script>

источник

2013-11-29 06:33:14

Карусель не работает в twitter bootstrap 2.3.2

ответ

Смежные вопросы