Javascript 如何在中心模式下创建平滑滑块JS幻灯片

我想使用优秀的Slick Slider（）实现一个旋转木马，我以前在图像中使用过它，没有任何问题。除了使用几个div之外，我正在尝试创建一个类似于示例的“中心模式”幻灯片

我想做这样的事情

这些是我想在codepen上使用的分区-

DG Aurum
实时视图

问题是，当我添加光滑的滑块代码时，它会弄乱页面的布局

---

我已经试着查看了这里的其他问题，但我找不到适合我的解决方案，我对JS是相当陌生的。

如果你继续加载slick slider css文件，应该可以很好地解决这个问题//cdn.jsdeliver.net/npm/slick-carousel@1.8.1/slick/slick.css。我是在我自己的代码笔上制作了一个非常简单的slick slider版本并从那里开始之后才发现这一点的。我的滑块做的事情和你的一样，直到我添加了css代码。我还为它加载了一个文档就绪函数

$(document).ready(function(){
  $('.your-class').slick();
});

$(document).ready(function(){
  $('.your-class').slick();
});