滑动滑块重新定位

在我的项目中，我使用滑动滑块插件（http://kenwheeler.github.io/slick/）。我想知道是否可以重新定位光滑点。默认情况下，它们显示在应用了滑动滑块的div容器下面。我想在这里实现的是在滑动div块内放置光滑的点。我用箭头实现这一点没有问题，因为我可以用自定义类名称来引用它们。
我的HTML看起来像这样：
滑动滑块重新定位

<div class="slider-fade"> 
<div> 
    <div class="text-box"> 
    <h2>Lorem ipsum</h2> 
    ...additional text 
    </div> 
</div> 
<div> 
    <div class="text-box"> 
    <h2>Lorem ipsum</h2> 
    ...additional text 
    </div> 
</div> 
<div> 
    <div class="text-box"> 
    <h2>Lorem ipsum</h2> 
    ...additional text 
    </div> 
</div> 
</div>

我JS的设置是这样的：

$('.slider-fade').slick({ 
autoplay: true, 
autoplaySpeed: 3000, 
infinite: true, 
speed: 500, 
fade: true, 
cssEase: 'linear', 
prevArrow: $('.prev'), 
nextArrow: $('.next'), 
dots: true 
});

所以，正如我所说，现在的点显示在整个slider-fade类下面，但我想得到它，例如，在text-box类之下。这是可以实现的吗？

视觉表示：http://i.stack.imgur.com/jmocB.png

目的是让该块内的箭头下方的点。

来源

2015-08-26 Chris Birch

Slick在类别.slick-dots中生成一个光滑的圆点。那个班有绝对的位置。所以，最简单的方法来达到你想要的是造型添加到该分区：

.slick-dots { 
    top: 100px; // play with the number of pixels to position it as you want 
    left: 100px; // play with the number of pixels to position it as you want 
}

来源

2015-08-26 10:25:43

谢谢。我不知道我为什么这么难。 –

我试过这个，但是点消失了。 – natsumiyu

@mori你可以用JSFiddle打开一个新的问题，我会尽力帮你。如果你这样做，只需在这里链接到你的问题 –

你也可以用在包装的overflow: hidden（在这个例子滑盖褪色）。这样它将围绕点。

来源

2017-08-16 09:28:18

您可以在Slick设置中使用“appendDots：$（Element）”。它会将点附加到该元素。您可以使用普通CSS将该元素放置在任何位置。如果您希望通过幻灯片，那么您可以在元素上使用绝对或相对定位。

来源

2017-09-04 20:04:10 iiR

这完美的谢谢！ –

滑动滑块重新定位

回答

相关问题