i like to use the Bootstrap carousel slider. Is it possible to start the slider without the active class in the first Image? The code is set with TYPOSCRIPT and i can not set the first item to active. Is there a way with JavaScript?
Thanx for help
Christian
HTML Code
<div class="carousel slide article-slide" id="myCarousel">
<div class="carousel-inner cont-slider">
<div class="item">
<img class="img-responsive" src="http://placehold.it/800x300/cccccc/ffffff">
</div>
<div class="item">
<img class="img-responsive" src="http://placehold.it/800x300/999999/cccccc">
</div>
<div class="item">
<img class="img-responsive" src="http://placehold.it/800x300/dddddd/333333">
</div>
</div>
</div>
$('. carousel'). carousel({ interval: false, }); That will make the auto sliding stop because there no Milliseconds added and will never slider next.
You can simply use the data-interval attribute of the carousel class. It's default value is set to data-interval="3000" i.e 3seconds. All you need to do is set it to your desired requirements.
To turn off the autoplay set data-interval="false" to the carousel element.
In browsers where the Page Visibility API is supported, the carousel will avoid sliding when the webpage is not visible to the user (such as when the browser tab is inactive, the browser window is minimized, etc.).
Yes, you can add class like this (using jQuery):
$(document).ready(function () {
$('#myCarousel').find('.item').first().addClass('active');
});
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With