更改 Slick 轮播箭头的位置

Question

我想要将 slick轮播箭头 的位置更改为图片中的位置，但我无法在jquery中实现相同效果。

$('.your-class').slick({
    dots: true,
    infinite: true,
    speed: 300,
    slidesToShow: 1,
    centerMode: true,
    variableWidth: true,
    prevArrow:'<i class=" fas fa-angle-right clr-gry"></i>',
    nextArrow:'<i class="fas fa-angle-left clr-gry"></i>'

});

- Swift

---

看起来更像是 CSS 的问题，而不是 JavaScript 的问题，你能发一下你应用的样式吗？ - kevmc

我还没有应用任何CSS。 - Swift

Answer 1

在你的 Slick 函数中添加 Class，例如：

prevArrow: $(".pp2"),
nextArrow: $(".nn2"),

&以下是带样式的添加按钮：

<button class="pp2">back</button>
<button class="nn2">forward</button>

- rajesh

Answer 2

.slick-next和.slick-prev是slick轮播插件中预定义的类。如果要自定义箭头的CSS，您可以使用这些类来获得所需的结果。

无论您是使用jQuery还是React，都可以使用此方法。

- Prince Raj

Answer 3

您可以使用CSS更改箭头的位置。尝试以下方式：

.clr-gry.slick-arrow {
    top: 0;
    position: absolute;
}
.fa-angle-left.clr-gry {
    right: 10px;
}

.fa-angle-right.clr-gry {
    right: 0;
}

如果这个不起作用，请分享HTML页面。

- Natasha Gaikwad