Сова карусель - Поместите счетчик изображений в середине кнопок навигации - PullRequest
0 голосов
/ 24 августа 2018

Я только что спроектировал навигационные кнопки совы карусели «следующий» и «предыдущий», изменив строки 2966 и 2968, чтобы они выглядели как стрелки.

enter image description here

enter image description here

Теперь я хочу добавить div, который будет содержать счетчик изображений в середине кнопок навигации.

Это изображение может дать вамБолее четкое представление о том, что я спрашиваю:

enter image description here

Вопрос:

Какую строку нужно изменить, чтобы я мог поставитьчто-то между навигационными кнопками в owl.caroussel.js?

Я пытался поместить некоторые теги h1, чтобы я мог видеть их между ними, это не сработало.

Спасибо всем.

1 Ответ

0 голосов
/ 24 августа 2018

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

https://owlcarousel2.github.io/OwlCarousel2/docs/api-events.html

Таким образом, вы можете свободно создавать свою навигацию.

Грубый пример, частично извлеченный из документациис некоторыми дополнениями:

// initialize without navigation:

var owl = $('.owl-carousel');
owl.owlCarousel({
    nav: false,
});

// trigger go to next item on your own next navigation button:

$('.customNextBtn').click(function() {
    owl.trigger('next.owl.carousel');
})

// trigger go to the previous item:

$('.customPrevBtn').click(function() {
    owl.trigger('prev.owl.carousel', [300]);
})

Ваша разметка может выглядеть следующим образом

<div class="gallery">
    <div class="owl-carousel"></div>
    <div class="navigation">
        <span>prev</span>
        <span>1/42</span>
        <span>next</span>
    </div>
</div>
...