2013-02-25 3 views
0

J'utilise le framework Twitter Bootstrap pour créer un carrousel, mais je n'ai aucun succès. Voici mon script/déclarations CSS:Bootstrap Carousel Non Chargement

<link href ="css/bootstrap.css" rel="stylesheet"> 
    <link href="css/main.css" rel="stylesheet"> 
    <script src="http://code.jquery.com/jquery-1.9.1.min.js"></script> 
    <script src="scripts/bootstrap.js" type=text/javascript></script> 
    <script> 
     $(document).ready(function(){ 
      $('.carousel').carousel(); 
     }); 
    </script> 

Voici mon balisage carrousel applicable:

<div class="carousel-container"> 
      <div id="carousel-main" class="carousel slide"> 
       <div class="carousel-inner"> 
        <div class="item active"><img src="slide1.jpg" /></div> 
        <div class="item"><img src="slide2.jpg /"> </div> 
        <div class="item"><img src="slide3.jpg /"> </div> 
       </div> 
       <a class="carousel-control left" href="carousel-main" 
        data-slide="prev">&lsaquo</a> 
       <a class="carousel-control right" href="carousel-main" 
        data-slide="next">&rsaquo</a> 
      </div> 
     </div> 
    </div> 

Quand je charge la page, tout le contenu, sauf mon carrousel apparaît. Où vais-je mal?

+0

Est-ce que cela fait une différence si vous spécifiez le type de script pour votre script en ligne? (le document prêt) –

Répondre

2

Vous avez une fermeture </div> supplémentaire à la fin de votre marge ..

Aussi, ne pas oublier d'ajouter des guillemets autour du type="text/javascript" lors de l'association fichier bootstrap.js .. Si vous avez un HTML 5 doctype la type attribut n'est pas nécessaire ..

Vous faites référence également à vos images de façon incorrecte:

Edit: au lieu de: <img src="slide3.jpg /"> utilisation: <img src="slide3.jpg" />

+0

Merci d'avoir attrapé ces erreurs stupides, mais même alors, le carrousel ne semble pas être en charge. – user1427661