javascript - 如何在 UIkit slider 中放置点导航

Question

如何为 uikit 的 slider 组件添加点导航。我试过了，

<div data-uk-slider>
  <div class="uk-slider-container">
    <ul class="uk-slider uk-dotnav uk-grid-width-medium-1-4">
      <li><a href=""><img src="image1.png"></a></li>
      <li><a href=""><img src="image2.png"></a></li>
      <li><a href=""><img src="image3.png"></a></li>
      <li><a href=""><img src="image4.png"></a></li>
      <li><a href=""><img src="image5.png"></a></li>
    </ul>
  </div>
</div>

但只有点显示？

Answer 1

作为cssBlaster21895提到 UIkit 文档仅提供将 dotnav 直接集成到 slideset 组件中，但是 dotnav 文档暗示它可以集成到所有其他 UIkit 组件中。

基本上，您可以在 slider 内添加常用的 dotnav HTML:

<ul class="uk-slider-nav uk-dotnav">
    ...
</ul>

然后包含 dotnav 组件 JS 和 CSS。

https://cdnjs.cloudflare.com/ajax/libs/uikit/2.27.2/css/components/dotnav.min.css https://cdnjs.cloudflare.com/ajax/libs/uikit/2.27.2/js/components/dotnav.min.js

查看我的 Fiddle有关如何通过工作示例实现这一点的更详细说明。