自定义WP FlexSlider插件 - 删除上一个/下一个侧面板

Question

我想知道是否有办法要么a）减小滑块的上/下侧的宽度，或者b）完全移除这两个面板但是保持箭头到位以循环滑动？ （这些元素似乎是ul.flex-direction-nav。）

我试过了 ul.flex-direction-nav { display:none; }无济于事。

滑块可以在此主题中使用 - http://themeforest.net/item/serene-magazine-wordpress-theme/5663537

Answer 1

它使用的样式比你试图用它们覆盖的样式更具体。

完全删除：

#featured-slider .flex-direction-nav { display:none; }

然后你需要从#featured-slider删除填充：

#featured-slider { padding:none; }

如果您在firebug中进行测试，则需要在插件的jquery添加这些样式后滚动才能正确显示调整。

---

要重新调整大小：

您需要调整下一个/上一张幻灯片的宽度，链接的宽度，箭头的位置，和围绕箭头的圆圈定位。 100px宽的例子：

<!-- next/prev slide width -->
#featured-slider { padding-left:100px; padding-right:100px; }

<!-- link width -->
#featured-slider .flex-direction-nav a { width:100px; }

<!-- circle position -->
#featured-slider .flex-direction-nav a:after { left:30px; }

<!-- arrow position -->
#featured-slider .flex-direction-nav a:before { left:36px; }

希望有所帮助。

Answer 2

Flexslider实际上已经有默认设置来控制是否显示导航。在您调用flexslider的JS中，尝试类似：

$('.your-flex-element').flexslider({
 controlNav: false;
 directionNav: false;
});