光滑的旋转木马 - 隐藏控件？

Question

是否有任何选项可以停止巧妙地添加下一个和上一个按钮？我似乎无法通过 css.

隐藏它们

<button type="button" data-role="none" class="slick-prev" aria-label="previous" style="display: inline-block;">Previous</button>

Answer 1

你想隐藏按钮吗？然后试试这个 CSS:

.slick-prev:before,
.slick-next:before {
   display:none;
}

Answer 2

将 prevArrow: false 和 nextArrow: false 添加到您调用轮播的位置。例如）

$('.slider').slick({
    dots: false,
    prevArrow: false,
    nextArrow: false
});

我添加了 dots: false 以防你也想删除它。

Answer 3

我在使用 javascript 隐藏按钮时遇到问题，所以我尝试将其与 CSS

一起使用

.slider button{
    display: none;
}

，但这没有用，所以我使用

.slider button{
    visibility: hidden;
}

它没有指针事件，所以您可以继续使用。

Answer 4

如果你想去掉两个箭头：

$('.slider').slick({
   arrows: false
});

Answer 5

$('.slider').slick({
 arrows: false
});

Answer 6

要仅使用 CSS 隐藏按钮，这对我有用：

nav.slick__arrow {
  height: 0;
  overflow: hidden;
}

我也用过：

nav.slick__arrow, ul.slick-dots {
  display: none!important;
}

Answer 7

我在删除特定视口的箭头时遇到问题。

这对我有用。

$('.slider').slick({
 arrows: false
});

Answer 8

$('.my-Slider').slick({dots: false, prevArrow: false, nextArrow: false, arrows: false});