Current slide in materialize css carousel

Question

How to get current slide in materializecss carousel component? I don't know how to link from carousel content to active class in li tags.

For example i need get id element from div, where li class is active

Answer 1

Use onCycleTo callback function option:

 $('.carousel').carousel({
    duration: 100,
    indicators: true,
    onCycleTo: function(data) {
      //do what needs to be done in here ...
   }
});

The data param returns the carousel-item active Link Element. You could pass parameters with a data-attribute for example.

Answer 2

You can get the current slides index using onCycleTo. Adding this answer since the previous answers don't show what to do within the function. Here's an example to get you started:

$('.carousel').carousel({
    onCycleTo: function (ele) {
      console.log(ele);
      console.log($(ele).index()); // the slide's index
    }
});