如何在UIkit滑块中添加点导航

时间:2016-11-04 02:32:12

标签: javascript html css html5 getuikit

如何为uikit的滑块组件添加点导航。我试过了,

<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>

但只有点显示?

1 个答案:

答案 0 :(得分:0)

正如cssBlaster21895所述,UIkit文档仅提供了直接的dotnav集成到slideset组件中,但是dotnav文档暗示它可以集成到所有其他UIkit组件中。

基本上你可以在滑块内添加通常的dotnav HTML:

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

然后包括dotnav组件JS&amp; 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以获取有关如何通过工作示例实现此目标的更详细说明。