Cycle2：寻呼机仅显示第一张幻灯片的链接并隐藏其他幻灯片

Question

我正在使用Cycle2及其carousel插件。我试图将他们的寻呼机功能添加到我的页面，如下所示：

首先，我创建了容器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>~

这个“display：none”来自哪里？我错过了什么吗？如果我检查Chrome上的元素并删除“display：none”，则所有链接都会显示并完美地在幻灯片之间导航。

这是fiddle

Answer 1

好的，我可以通过覆盖默认样式来解决此问题。首先我将其添加到插件初始化中：

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

然后我在“cycle-pager-nav-circle”类中添加了CSS规则：

display: inline-block !important;

但是，如果有人作为更干净的解决方案，请提出您的建议。

Answer 2

hide-non-active也许是原因。它默认为true。 [Link]。