I want to make my owl-carousel auto play then I take it form some posts in stackoverflow but it doesn't works
.js -->
$(document).ready(function(){
owl = $(".owl-carousel");
owl.owlCarousel({
loop:true,
autoplaySpeed:1000,
items:5,
autoplay:true
});
});
my html-->
<div class="container awards mt-5">
<h1 class="text-title text-red">
Awards
</h1>
<div class="owl-carousel owl-six" data-inner-pagination="true" data-white-pagination="true" data-nav="false" data-autoPlay="true">
{% for item in page.awards.all %}
{% image item.image width-2048 as event_image %}
<div class="award-image" style="background-image:url({{ event_image.url }})"></div>
{% endfor %}
</div>
</div>
The value of autoplay:true
is what will make the slider autoplay.
Edit your slider files and add autoplay:true
to it rather than pasting the entire snippet.
If you add autoplay:true
at the end of the parameters as the last parameter than you won't need a comma ,
. However if you add it in the middle then you will need a comma like so: autoplay:true,
In addition if you want the slider to automatically rotate every 5 seconds then replace the value of true with 5000. Example: autoplay:5000