在光滑的滑块中显示instagram风格的点

Question

我正在使用光滑的滑块显示很多滑块项目。我还需要使用点来显示项目的位置。目前，有很多点，我想像instagram一样显示这些点。

这是我的意思：

始终应最多可见6个点。从左侧的第一个开始。

有没有办法解决中间的四个点？目前，我只能通过class来访问活动点slick-active。但是我需要活动点之前和之后的点。

这是我实际的滑块代码：https : //codepen.io/cray_code/pen/ZrKpWY

Answer 1

您可以使用 jquery 的prev和next函数来访问上一个和下一个元素。

我在这里更新了您的 codepen 示例：链接

$('li.slick-active').prev().css('background-color', 'red');
$('li.slick-active').next().css('background-color', 'orange');