如何使用jQuery为slick.js的活动幻灯片设置样式？

Question

我想将活动幻灯片设置为橙色边框。

知道该类是：slick-active，结构如下：

<div class='slick-slide slick-active' ...>

我想出了这个：

的jQuery

$('div').find('.slick-active').css('border', 'orange 3px solid');

我无法让它们显示出来。有人可以帮我弄这个吗 ？

更新

修复我的jQuery语法错误后，我显示了边框，但这不是我故意想要的。

截至目前的结果：

这是我的JSFiddle

Answer 1

在我发现这个问题之前，我遇到了完全相同的问题：https://community.serif.com/forum/18904/how-do-i-add-the-slick-slider-to-webplus。 Martin有一个很好的答案，只需要在.slick-center类中添加一些css。在第一个代码块下添加橙色边框应该可以工作！

HTML

Answer 2

因为我面临同样的问题并需要进一步参考：

我可以使用 .slick-current

类完成此操作

我在它周围放了一个div，所以我可以选择 #divID .slick-current {}

示例：

#sliderPreviewBox .slick-current  {
padding-bottom: 5px;
border-bottom: 2px solid #006ab2;
color: blue; 
}