Materialize Carousel Slider autoplay

Question

Есть ли параметр, позволяющий автоматизировать воспроизведение карусели карусели?

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

, например (этот параметр не работает):

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

Спасибо!

Answer 1

Я решил проблему с этим:

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

Answer 2

Я была такая же проблема, и я реализую то же решение, как и вы. Я просто добавил другую функцию, чтобы перезапустить интервал после нажатия правой или левой стрелки (кнопка).

В правой стреле есть класс .fa-angle-right (fontawsome) и левый .fa-angle-left.

Так Моя функция Carousel вызова выглядит следующим образом:

$('.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 3

Попробуйте выполнить next метод как этот

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

Answer 4

Я решил проблему с этим кодом:

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

Answer 5

Вы можете просто слушайте карусель onCycleTo то событие сброса/включен автозапуск, как это:

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"); 
 
    } 
 
}