我添加了光滑的滑块以在我的网站上创建一个滑块。使圆点正常工作并将其附加到幻灯片中是使它们达到我想要的位置的唯一方法,但现在活动状态对圆点不起作用。
可能是因为包含了尽可能多的幻灯片。有人帮我吗?
$(document).ready(function() {
$('.main-slider').slick({
infinite: true,
slidesToShow: 1,
slidesToScroll: 1,
dots: true,
appendDots: '.appendDots',
});
});
<div class="flex-center" style="background-image: url('http://lorempixel.com/1900/400')">
<div class="flex-inner">
<div class="container">
<div class="flex-content">
<div class="col-md-12">
<div class="appendDots"></div>
</div>
<div class="col-md-12">
<h2>Distributor of commercial vehicle parts & Accessories</h2>
<p>To fit European truck & trailers</p>
</div>
<div class="col-md-12">
<a class="button button-background" href="#">Shop Now <span class='glyphicon glyphicon-circle-arrow-right'></span></a>
</div>
</div>
</div>
</div>
</div>
预先感谢您的任何回答。
最佳答案
从文档来看,slick期望使用(选择器,htmlString,数组,元素,jQuery对象),因此您应该执行以下操作。
$(document).ready(function() {
$('.main-slider').slick({
infinite: true,
slidesToShow: 1,
slidesToScroll: 1,
dots: true,
appendDots: $('.appendDots'),
});
});