How to start Owl Carousel after 2 seconds?
I have an owl Carousel slide, when the site is loading the images load in half and the autoplay, already starts and starts to pass without the images have fully loaded, I would like to know how do I start the autoPlay after 2 seconds that the page is fully loaded.
$('.slider').owlCarousel({
items: 1,
loop: true,
autoplay: true,
autoplayTimeout: 6000,
autoplayHoverPause: false,
margin: 0,
stagePadding: 0,
smartSpeed: 2000,
responsiveClass: true,
responsive: {
0: {
margin: 0,
stagePadding: 0
},
600: {
margin: 0,
stagePadding: 0
},
1000: {
margin: 0,
stagePadding: 0
}
}
});
<link href="https://cdnjs.cloudflare.com/ajax/libs/owl-carousel/1.3.3/owl.carousel.css" rel="stylesheet"/>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/owl-carousel/1.3.3/owl.carousel.js"></script>
<div class=" slider owl-theme owl-carousel">
<img alt="img slider" src="http://www.newsrondonia.com.br/imagensNoticias/image/IMAGEM].jpg" class="item">
<img alt="img slider" src="https://img1.ibxk.com.br/2017/07/13/13160112901226.jpg?w=700" class="item">
<img alt="img slider" src="https://blog.emania.com.br/content/uploads/2016/02/direitos-autorais-e-de-imagem-750x375.jpg" class="item">
</div>
1
Author: Sr. Bigode, 2017-09-14
2 answers
Change or autoplay to false
:
var owl = $('.slider').owlCarousel({
items: 1,
loop: true,
autoplay: false, //AQUI
autoplayTimeout: 6000,
autoplayHoverPause: false,
margin: 0,
stagePadding: 0,
smartSpeed: 2000,
responsiveClass: true,
responsive: {
0: {
margin: 0,
stagePadding: 0
},
600: {
margin: 0,
stagePadding: 0
},
1000: {
margin: 0,
stagePadding: 0
}
}
});
And then add call in onload like this:
$(window).load(function () {
owl.trigger('play.owl.autoplay', [2000]);
});
The [2000]
refers to the 2 seconds you asked for.
1
Author: Guilherme Nascimento, 2017-09-15 18:37:14
var $owl = $('.slider).owlCarousel(options);
var autoplayDelay = 2000;
if (autoplayDelay) {
$owl.trigger('stop.owl.autoplay');
setTimeout(function() {
$owl.trigger('play.owl.autoplay');
}, autoplayDelay);
}
0
Author: Jackowski, 2017-09-14 17:30:16