Cycle2: пейджер отображает только ссылку на первый слайд и скрывает остальные

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

Сначала я создал контейнер div:

<div id="concluidos-navigation" class="cycle-pager"></div>

Затем я установил параметры плагина следующим образом:

<ul class="cycle-slideshow"
            data-cycle-slides="> li"
            data-cycle-fx=carousel
            data-cycle-allow-wrap=false
            data-cycle-pager="#concluidos-navigation"
        >

Итоговый HTML-код для первого слайда:

<span class="cycle-pager-active">•</span>

Но для каждого другого слайда результат таков:

<span style="display: none;">•</span>~

Откуда этот "дисплей: ни один"? Я что-то пропустил? Если я проверяю элемент в Chrome и удаляю "display: none", все ссылки отображаются и отлично работают для навигации между слайдами.

Вот скрипка

2 ответа

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

data-cycle-pager-template="<strong class='cycle-pager-nav-circle'><a href=#></a></strong>"

А затем я добавил CSS-правило в класс cycle-pager-nav-circle:

display: inline-block !important;

Тем не менее, если кто-то как более чистое решение, пожалуйста, дайте свои предложения.

hide-non-active может быть причиной, возможно. По умолчанию true, [ Ссылка].

Другие вопросы по тегам