Carousel bootstrap
Résolu
kirua-93
Messages postés
652
Statut
Membre
-
Kombasrenda -
Kombasrenda -
Bonsoir,
Je viens de commencer le jquery et j'essaye d'utiliser le carousel de bootstrap, mais je ne comprend pas pourquoi mais images se place l'une en dessous de l'autre.
Mes fichier js et boot sont bien charger ainsi que le css
Le script pour lancer le js
et le html
J'ai chercher sur le net et essaye plusieurs méthode toute mais sans réussir.
Merci.
--
MUHAHAHAHAHAHAHAHAHA
Je viens de commencer le jquery et j'essaye d'utiliser le carousel de bootstrap, mais je ne comprend pas pourquoi mais images se place l'une en dessous de l'autre.
Mes fichier js et boot sont bien charger ainsi que le css
<script src="http://code.jquery.com/jquery-1.11.0.min.js"></script>
<link rel="stylesheet" href="css/style.css" />
<link rel="stylesheet" href="bootstrap/css/bootstrap.css" />
<link rel="icon" type="image/png" href="images/icon.ico"/>
<script type="text/javascript" src="bootstrap/js/bootstrap.js"></script>
Le script pour lancer le js
<script type='text/javascript'>
$(document).ready(function() {
$('.carousel').carousel({
interval: 2000
})
});
</script>
et le html
<div id="carousel-example-generic" class="carousel slide" data-ride="carousel">
<!-- Indicators -->
<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>
<!-- Wrapper for slides -->
<div class="carousel-inner">
<div class="item active">
<img src="images/images1.jpg" alt="dsdsd">
<div class="carousel-caption">
<h1>coucouc</h1>
<h3>dsd</h3>
</div>
</div>
<div class="item active">
<img src="images/images2.png" alt="dsdsd">
<div class="carousel-caption">
<h1>coucouc</h1>
<h3>dsd</h3>
</div>
</div>
</div>
<!-- Controls -->
<a class="left carousel-control" href="#carousel-example-generic" data-slide="prev">
<span class="glyphicon glyphicon-chevron-left"></span>
</a>
<a class="right carousel-control" href="#carousel-example-generic" data-slide="next">
<span class="glyphicon glyphicon-chevron-right"></span>
</a>
</div>
J'ai chercher sur le net et essaye plusieurs méthode toute mais sans réussir.
Merci.
--
MUHAHAHAHAHAHAHAHAHA
4 réponses
-
Salut,
Plusieurs pistes :
- tes balises link pour les fichiers css doivent être dans la balise head de ton document html
- les scripts doivent de préférence être appelés à la fin de ton document, juste avant la fermeture de la balise body
- tu appliques à tous tes slides la classe active, seul le premier slide doit avoir cette classe
As tu des erreurs dans la console web du navigateur ? -
-
Yop,
Déjà merci Pitet, et mon problème était du au fait que touts mes slides avez la classe active.
Tout marche bien thanks.
-
Le problème c'est que tu as activer tous les deux images. Active seulement une
<div class="item active">...
