Contrôler carousel bootstrap
Bonjour,
Je travail actuellement sur un site Web de photos où je dispose d'un carousel. Je l'alimente via php/mysql...
J'aimerai permettre à l'utilisateur de choisir de pourvoir passer ou non en mode diaporama.
Code:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16
| <div class="gallery-show">
<!-- Image Carousel -->
<div id="gallery-carousel" class="carousel slide" data-interval="false" data-ride="carousel">
<!-- Wrapper for slides -->
<div class="carousel-inner">
...... Photos php/mysql...........
</div>
<!-- Controls -->
<a id="prev" class="carousel-arrow carousel-arrow-prev" onClick="updateInfo('prev')" href="#gallery-carousel" data-slide="prev">
<i class="fa fa-angle-left"></i>
</a>
<a id="next" class="carousel-arrow carousel-arrow-next" onClick="updateInfo('next')" href="#gallery-carousel" data-slide="next">
<i class="fa fa-angle-right"></i>
</a>
</div>
</div> |
C'est le
Code:
data-interval="false"
qui permet d'empêcher le défilement automatique.
J'ai essayé sur le clique d'un bouton cette petite fonction javascript :
Code:
1 2 3 4
| function diaporama() {
var div = document.getElementById('gallery-carousel');
div.removeAttribute('data-interval');
} |
Sans succès =/
Merci de votre aide !
GJuubz