Menu
I have multiple owl carousel set up on my home page. I have the first one (the one about free shipping) set to a slideSpeed of 10000. As you can see all the slide change at the same speed.
Is there a reason this doesn't work? Am i doing something wrong?
961
One thing I should note, I had content inside my owl-item that was set to position: absolute with a z-index of 1 . That was causing the positioned content to pop in right away with no fade. I removed the z-index and that fully solved my issues. This solution helped me slow down the transition duration..
Setting of the responsive is very simple. Structure of responsive option: responsive : { // breakpoint from 0 up 0 : { option1 : value, option2 : value, ... }, // breakpoint from 480 up 480 : { option1 : value, option2 : value, ... }, // breakpoint from 768 up 768 : { option1 : value, option2 : value, ... } }
Just set time to autoPlay option
$("#slider").owlCarousel({
autoPlay: 2500,
//autoPlay: true, <-- if you want to set default slide time (5000)
slideSpeed: 300,
paginationSpeed: 500,
singleItem: true,
navigation: true,
scrollPerPage: true
});
Please note that you have to use
autoplay:true,
autoplayTimeout:5000
when using owlCarousel 2.0
42
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
