UIkit幻灯片元素覆盖了Navbar

Question

我的首页网页是一个很长的滚动页面。我正在使用UIkit，并成功添加了许多元素。我在顶部添加了一个标准导航栏。当我向下滚动页面时，我的问题就出现了。大多数元素都会像人们期望的那样滚动到条形图后面，但是我的一些元素会滚动到导航栏上 - 包括图片和文本。

执行此操作的元素使用uk-slideshow属性。

以下是有关两个元素的HTML：

 <!-- Nav Bar -->
<nav class="uk-navbar" data-uk-sticky>
  <ul class="uk-navbar-nav">
    <li><a href="">Contact</a></li>
    <li><a href="">About Us</a></li>
    <li><a href="">Services</a></li>
  </ul>
</nav>

幻灯片......

<ul class="uk-slideshow" data-uk-slideshow="{autoplay:true}">
  <li>
    <div class="person">Sara
      <img src="images/agent_p2.jpg" class="id">
      <p>Lorem ipsum ... </p>             
    </div>
  </li>
</ul>

为什么会这样？

Answer 1

我解决了这个问题。 Uikit中的uk-navbar没有分配z-index。在导航中添加了z-index并修复了问题。