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
, [ Ссылка].