Как подсветить название активного слайда карусели?

Question

[fgeniy]

Есть карусель - Owl.js. Суть в чем - при изменении слайда, цвет подписи должен меняться. Нужно привязать активный слайд к соответствующему названию и чтобы подпись менялись вместе со слайдом.

Частично получилось реализовать при помощи дата-атрибутов с хешами, но подсветка происходит когда кликаешь по названию, а когда слайд автоматически меняется, то смена не цвета не происходит.

<div class="owl-carousel owl-theme">
    <div class="item"  data-hash="1"><img src="img/bg_2.jpg" alt=""></div>
    <div class="item"  data-hash="2"><img src="img/bg_3.jpg" alt=""></div>
    <div class="item"  data-hash="3"><img src="img/bg_4.jpg" alt=""></div>

</div>

        <div class="url_block">
          <div class="container">
    <div class="row">
           <div class="col-md-4">
                 <a href="#1" class="trigger">Gresso Grand Wind</a>
            </div>
            <div class="col-md-4">
                <a href="#2" class="trigger">Glasshritte Original</a>
            </div>
            <div class="col-md-4">
                <a href="#3" class="trigger">GUESS</a>
            </div>
        </div>
    </div>
</div>

Answer 1

[Stalker_RED]

Вот же список событий https://owlcarousel2.github.io/OwlCarousel2/demos/...
Подпишитесь на changed.owl.carousel, например.

Comments

[fgeniy]

да, но нет пояснений к ним.

[Stalker_RED]

fgeniy:

frontend dev

Ну зашибись теперь. А чтобы заметить, что там в шапке рядом с "demos" есть еще "docs", для этого надо senior developer'ом быть?

https://owlcarousel2.github.io/OwlCarousel2/docs/a...

[fgeniy]

Stalker_RED: не обессудьте. я ведь только учусь)

Answer 2

[Евгений]

$('.step-slider').on('changed.owl.carousel', function(event) {
        var idx = event.item.index; // номер активного элемента
});