底部的 Flexslider 导航按钮未显示

Question

我正在使用 flexslider 2（基本样式）。左右箭头显示正确，但图像底部的导航按钮未显示。我在这里和通过 Google 寻找解决方案，但我只能找到与侧导航箭头（工作正常）相关的答案，而不是下面的按钮

我在 head 标签中添加了 controlNav: true 但没有任何区别：

<script type="text/javascript">
$(window).load(function() {
  $('.flexslider').flexslider({
    controlNav: true,
    animation: "slide"
  });
});
</script>

并且 flexslider.css 有：

.flex-control-nav {
  width: 100%;
  position: absolute;
  bottom: -40px;
  text-align: center;
}
.flex-control-nav li {
  margin: 0 6px;
  display: inline-block;
  zoom: 1;
  *display: inline;
}

我尝试将 bottom: -40px; 更改为 bottom: -100px; ，认为导航按钮可能隐藏在图像下方，但这也没有任何区别。

我检查过字体文件在正确的位置，确实是这样，否则箭头不会显示，但我不明白为什么点不显示。我确定这将是我做错的简单事情。

Answer 1

尝试更改为：

.flex-control-nav {
  width: 100%;
  position: absolute;
  bottom: 0;
  text-align: center;
}

或从 .flexslider

中删除 overflow: hidden

底部的 Flexslider 导航按钮未显示

Flexslider nav buttons at bottom are not showing

html

javascript

css

flexslider