Carousel avec Bootstrap

Bonjour,

Je débute avec Bootstrap et j'essaye d'insérer un carrousel dans ma page web mais les flèches next et previous ne fonctionnent pas:-(… Une idée de mon erreur?

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
<div class="col-lg-10">
         	
              <div id="carousel-example-generic" class="carousel slide" data-ride="carousel">
                <ol class="carousel-indicators">
                  <li data-target="#carousel-example-generic" data-slide-to="0" class="active"></li>
                  <li data-target="#carousel-example-generic" data-slide-to="1"></li>
                  <li data-target="#carousel-example-generic" data-slide-to="2"></li>
                </ol>
                <div class="carousel-inner">
                  <div class="item">
                    <img src="images/portraits/portrait.jpg" alt="First slide">
                  </div>
                  <div class="item active">
                    <img src="images/neurosciences/neurosciences.jpg" alt="Second slide">
                  </div>
                  <div class="item">
                    <img src="images/kungfu/kungfu.jpg" alt="Third slide">
                  </div>
                </div>
                <a class="left carousel-control" href="#carousel-example-generic" role="button" data-slide="prev">
                  <span class="glyphicon glyphicon-chevron-left"></span>
                </a>
                <a class="right carousel-control" href="#carousel-example-generic" role="button" data-slide="next">
                  <span class="glyphicon glyphicon-chevron-right"></span>
                </a>
              </div>
          
          </div>

J'ai pourtant bien à la fin de mon code html:

Code:

1
2
3
4
5
6
7
8
<!-- Bootstrap core JavaScript
    ================================================== -->
    <!-- Placed at the end of the document so the pages load faster -->
    <script src="https://code.jquery.com/jquery-1.10.2.min.js"></script>
    <script src="../bootstrap-3.2.0-dist/js/bootstrap.min.js"></script>
  </body>
</html>

et ceci au début:

Code:

1
2
<!-- Bootstrap core CSS -->
    <link href="bootstrap-3.2.0-dist/css/bootstrap.css" rel="stylesheet">

Je suppose que si je voulais mettre plusieurs thumbnails sous mon image pour pouvoir sélectionner l'image que je veux voir en grand je serais obligée de passer par du javascript et que ce n'est peut-être pas trop une bonne idée si mon but est d'avoir un site responsive?

Merci pour votre aide