Question

在Zurb Foundation Orbit Content Slider中，如何删除顶部的小子弹/圆圈，表示您拥有多少张幻灯片（也可点击）？我希望他们走了。

Answer 1

zurb-foundation 5顶部没有子弹/圆圈。

所以我假设你正在使用this type of orbit。

在你的css文件中某处尝试.orbit-bullets {display: none;}怎么样？

Answer 2

您可以使用ul：

中的data-options属性

<ul data-orbit data-options="bullets:false;">
  <li>
    <img src="satelite-orbit.jpg" alt="slide 1" />
  </li>
  <li>
    <img src="andromeda-orbit.jpg" alt="slide 2" />
  </li>
  <li>
    <img src="launch-orbit.jpg" alt="slide 3" />
  </li>
</ul>

您也可以使用Javascript：

$(document).foundation({
  orbit: {
    timer_speed: 1000,
    bullets: false
  }
});

基金会5在Orbit page的底部有更多文档。

Answer 3

使用哪个版本的Foundation无关紧要。如上面的答案所述;设置轨道子弹以显示无应该工作。

示例：

.orbit-bullets { display: none; }

您还可以尝试以下方法：

.orbit-bullets-container { display: none; }

如果这些声明都不起作用，我猜这个问题就在你的CSS中。看起来你已经设置了orbit-bullets来设置它们在样式表中的某个地方，之后你将它们设置为none，可能在父div中;或者您在基金会的CSS之前调用样式表，并在声明后覆盖它。使用任何框架时，您应该首先调用这些样式和脚本;在您的申请文件之前。

如果你能提供一个例子，那就不难解决。

如何删除Foundation的轨道内容滑块顶部的小子弹/圆圈？

3 个答案: