光滑滑块的光滑点之间的虚线

【问题标题】：dashed line in between slick dots of slick slider光滑滑块的光滑点之间的虚线
【发布时间】：2022-01-17 09:38:10
【问题描述】：

我想在光滑滑块的光滑点之间创建虚线。我已经为它上传了图片。我怎样才能做到这一点？enter image description here

【问题讨论】：

【解决方案1】：

我会使用设置 appendDots 将点附加到以虚线为背景的包装 div。

也许类似（未经测试）：

 $('.slider').slick({
   slidesToShow: 3,
   slidesToScroll: 1,
   dots: true,
   appendDots: '.js-slick-dots',
 });

HTML

<div class="slick-dots-wrapper">
  <hr class="dotted-line">
  <div class="js-slick-dots"></div>
</div>

CSS：

.slide-dots-wrapper {
  position: relative;
}

.dotted-line {
  border-top: 1px dashed #fff;
  position: absolute;
  width: 100%;
  z-index: 1;
}

.js-slick-dots {
  position: absolute;
  z-index: 99;
}

【讨论】：