Javascript 响应时无法将导航点居中放置在光滑的滑块（slick.js）上

使用的滑块来自

我无法使导航点位于滑块本身的中心（水平），并在响应时保持居中

我似乎也无法让这些点在某些宽度（1000px-740px）下完全消失，并与滑块div的响应性一起工作

jsfiddle中的代码段

---

感谢大多数浏览器在默认情况下为

添加了填充，因此您需要在

.flick dots ul

中添加

填充：0

，以停止将圆点推到上方，然后它们将水平居中

就圆点消失而言，您的slick JS responsive断点中有

dots:false

，因此如果您希望显示它们，请将其调整为true（或者删除该行，因为在slick创建中圆点默认为true）

$（文档）.ready（函数（）{
$（“.slider posts all”）.slick({
幻灯片放映：3，
幻灯片滚动：1，
自动播放：错误，
点：是的，
附录点：$（“.slick dots”），
/*得到点*/
圆点类：$（“.slick dots”），
/*得到点*/
自动播放速度：4000，
速度:700,，
下一行：$（“.next”），
prevArrow:$（“.prev”），
响应：[{
断点：1024，
设置：{
幻灯片放映：3，
幻灯片滚动：1，
无限：是的，
/*删除点：假以显示740px-1024px之间的点*/
/*圆点：错*/
}
},
{
断点：740，
设置：{
幻灯片放映：1，
幻灯片滚动：1
}
},
{
断点：600，
设置：{
幻灯片放映：1，
幻灯片滚动：1
}
}
//现在可以通过添加以下内容在给定断点取消单击：
//设置：“取消单击”
//而不是设置对象
],
});
});
正文{
背景颜色：灰色；
}
/*本月月月月月月月月月月月月月月月月月月月月月月月月月月月月月月月月月月月月月月月月月月月月月月月月月月月月月月月月月月月月月月月月月月月月月月月月月月月月月月月月月月月月月月月月月月月月月月月月月月月月月月月月月月月月月月月月月月月月月月月月月月月月月月月月月月月日日日日日日日日日日日日日日日日日日日日日日日日日日日日日日日日日日日日日日日日日日日日日日日日日日日日日日日日日日日日日日日日日日日日日日日日日日日日日日日日日日日日日日日日日日日日日日日日日日日日日日日日日日日日日##*/
.滑块包装器{
背景色：；
填充顶部：30px；
}
.滑块{
背景色：；
边界：；
1px纯红；
填充顶部：30px；
位置：相对位置；
}
.滑块.滑块标题{
背景色：；
文本对齐：居中；
保证金：30像素自动；
字体系列：；
Arial，
赫尔维蒂卡，
无衬线；
}
.slider.prev{
位置：绝对位置；
最高：45%；
左：10vw；
字号：2em；
光标：指针；
}
.滑块，下一个{
位置：绝对位置；
最高：45%；
右：10vw；
字号：2em；
光标：指针；
左侧填充：25px；
}
.slider发布所有{
背景色：；
边界：；
1px红色虚线；
宽度：70vw；
身高：100%；
保证金：0px自动；
溢出：隐藏；
填充：-70px 0px-10px 0；
}
.滑柱h4{
填充：0px；
边际：0px；
字号：；
}
.滑柱{
背景色：；
背景色：rgba（40,40,40,1）；
不透明度：1；
利润率：0px 0.7vw；
显示：内联块；
身高：100%；
宽度：300px；
溢出：隐藏；
边界半径：5px；
颜色：rgb（200200200200）；
字体大小：15px；
}
.滑块图像{
背景颜色：黄色；
宽度：100%；
身高：；
边框左上半径：5px；
边框右上角半径：5px；
}
.帖子信息{
背景色：；
高度：50px；
溢出：；
边界：；
1px纯绿色；
边际上限：0px；
-5px；
左边距：5px；
右边距：1px；
填充：10px 5px 20px 0px；
}
.post info h4 a{
颜色：继承；
保证金：5px；
文字装饰：无；
}
.发布信息a:悬停{
颜色：rgb（30,30,30）；
}
.post info i{
字体大小：15px；
}
@媒体屏幕和屏幕（最大宽度：840像素）{
.滑块{
垫顶：12vh；
}
.滑柱{
背景色：；
身高：；
字号：；
}
.slider发布所有{
宽度：85%；
变焦：90%；
}
.slider.prev{
左：15px；
最高：55%；
}
.滑块，下一个{
右：15px；
最高：55%；
}
}
@媒体屏幕和屏幕（最大宽度：740像素）{
.滑块{
宽度：；
}
.滑柱{
背景色：；
身高：；
字号：；
}
.slider发布所有{
宽度：55vw；
变焦：90%；
}
.slider.prev{
左：13vw；
}
.滑块，下一个{
右：13vw；
}
.滑块图像{
宽度：；
身高：；
变焦：90%；
}
}
@介质屏幕和（最大宽度：760px）和（最小宽度：595px）{
.post info i{
字体大小：11px；
}
}
/*圆点*/
.圆滑的点.圆滑的滑块{
边缘底部：30px；
}
.圆点{
背景颜色：紫色；
位置：绝对位置；
底部：-25px；
显示：块；
宽度：96.255vw；
填充：0；
保证金：0；
列表样式：无；
文本对齐：居中；
}
/*新代码*/
.光滑圆点{
填充：0；
}
/*结束新代码*/
/*@媒体屏幕和屏幕（最大宽度：740像素）{
.圆点{
宽度：92.3vw；
}
}
@媒体屏幕和屏幕（最大宽度：600px）{
.圆点{
背景色：；
宽度：90.05vw；
}
} */
.圆点李{
背景色：；
位置：相对位置；
显示：内联块；
宽度：20px；
高度：20px；
利润率：0.5px；
填充：0；
光标：指针；
}
.光滑圆点li按钮{
背景色：透明；
字体大小：0px；
线高：0；
边界半径：50%；
显示：块；
宽度：20px；
高度：20px；
填充物：5px；
光标：指针；
颜色：；
边界：0；
大纲：无；
背景：；
}
.圆点li按钮：悬停，
.圆点li按钮：聚焦{
大纲：无；
}
.圆点li按钮：悬停：之前，
.圆点li按钮：焦点：之前{
不透明度：1；
背景色：；
颜色：；
}
.圆点li按钮：之前{
背景色：红色；
字体系列：“光滑”；
字体大小：16px；
线高：20px；
边界半径：50%；
位置：绝对位置；
排名：0；
左：0；
宽度：20px；
高度：20px；
内容：“•”；
文本对齐：居中；
不透明度：1；
颜色：紫色；
-webkit字体平滑：抗锯齿；
-moz osx字体平滑：灰度；
}
.slick dots li.slick-active按钮：之前{
不透明度：1；
颜色：蓝色；
}
/* #######
.slick-dots
{
    background-color:  purple;
    position: absolute;
    bottom: -25px;
    display: block;
    width: 96.255vw;
    padding: 0;
    margin: 0;
    list-style: none;
    text-align: center;
}