Materialize autostart carousel slider

Question

Is there a parameter that allows automatic carousel playback to materialize?

$('.carousel').carousel(); 

for example (this parameter does not work):

 $('.carousel').carousel({ autoplay: true }); 

Thanks!

Answer 1

I solved the problem with this:

 $('.carousel').carousel({ padding: 200 }); autoplay() function autoplay() { $('.carousel').carousel('next'); setTimeout(autoplay, 4500); } 

Answer 2

Try the next method like this

  $('.carousel').carousel(); setInterval(function() { $('.carousel').carousel('next'); }, 2000); // every 2 seconds 

Answer 3

I had the same problem and implemented the same solution as you. I just added another function to restart the interval after pressing the right or left arrow (button).

My right arrow has a class .fa-angle-right (fontawsome) and a left .fa-angle-left.

So, the My Carousel Call function looks like this:

 $('.carousel').carousel({ full_width:true, time_constant: 100 }); var carouselAutoplay = setInterval(function(){ $('.fa-angle-right').click(); }, 7000); $('.fa-angle-right').click(function(){ $('.carousel').carousel('next'); clearInterval(carouselAutoplay); carouselAutoplay = setInterval(function(){ $('.fa-angle-right').click(); }, 7000); }); $('.fa-angle-left').click(function(){ $('.carousel').carousel('prev'); clearInterval(carouselAutoplay); carouselAutoplay = setInterval(function(){ $('.fa-angle-right').click(); }, 7000); }); 

Answer 4

I solved the problem with this code:

  $('.carousel.carousel-slider').carousel({fullWidth: true, padding:200},setTimeout(autoplay, 4500)); function autoplay() { $('.carousel').carousel('next'); setTimeout(autoplay, 4500); } 

Answer 5

You can just listen to the onCycleTo carousel, and then reset / enable auto play as follows:

 var carousel = jQuery('div#home-carousel'); carousel.carousel({ fullWidth: true, indicators: true, duration: 300, onCycleTo : function($current_item, dragged) { console.log($current_item); stopAutoplay(); startAutoplay(carousel); } }); var autoplay_id; function startAutoplay($carousel) { autoplay_id = setInterval(function() { $carousel.carousel('next'); }, 5000); // every 5 seconds //console.log("starting autoplay"); } function stopAutoplay() { if(autoplay_id) { clearInterval(autoplay_id); //console.log("stoping autoplay"); } }