Angel Garcia
Posts: 0
Joined: Thu Jun 11, 2015 11:37 am

Multiple carousel animation on a page

I have a page with many animated carousels by the following function:

function menusAnimation () {
var onDelay = function(){
$('[data-role="__carousel"]').each(function() { Apperyio($(this).attr('dsid')).carouselRoot.carousel("next"); } );
};

Code: Select all

 window.clearInterval(self.carouselTimer); 
 self.carouselTimer = window.setInterval(onDelay, (Math.floor(Math.random() * (10-3+1)) + 3)*1000); 

}

Is the only way to make working all carousels (what I know). Is any way to change random value on each iteration?

Could I execute different instances of this function for each carousel to avoid synchronism between carousels (all carousels have the same ID because I create it depending a REST response)?

Pavel Zarudniy
Posts: 0
Joined: Mon Jul 06, 2015 8:56 am

Multiple carousel animation on a page

Hi Angel,
You can set delay time for each carousel separately by creating new timer to each other in function each

Return to “Issues”