setInterval(function() and updateVars() for many carousels

Question

Currently I have the following in my $(document).ready(function() AFTER the initialization for the sliders themselves.

This code represents 3 sliders and it works, but I have more sliders.

• When I add more than 4-5+ sliders then it doesn't work (it works on some, not others)

Is there a way to add a bunch of sliders here?

 setInterval(function(){

   var owldataTS = $(".testimonial-slider").data('owlCarousel');
   owldataTS.updateVars();

   var owldataMS = $(".multi-slider").data('owlCarousel');
   owldataMS.updateVars();

   var owldataMM = $(".mini-multi").data('owlCarousel');
   owldataMM.updateVars();


},1500);

BTW: this is used for when a page size changes without a re-size of the viewport, like toggling a sidebar or tab content.

Answer 1

You can give a common class for the sliders and do:

setInterval(function(){
 $(".common-class").each(function(){
    $(this).data('owlCarousel').updateVars();
 });
},1500);