我正在尝试使用slick-carousel作为100vh我单页网站上某个部分的滑块.
我正在使用jade,browserify,sass等.这是输出:
我将html/css简化为背景颜色,但实际内容却相同.
正如您所看到的那样,幻灯片显示在彼此之上,并且它们也被克隆.当您使用centerMode和无限设置时,我看到光滑的克隆会滑动.
这是我的代码:
玉:
section.services
.slick
.red
.green
.blue
Run Code Online (Sandbox Code Playgroud)
SCSS:
section.services {
@extend .padding0;
@include bgcolor(#fff);
.slick, .slick * {
outline: none;
}
}
.red {
height: 100px;
background: red;
}
.blue {
height: 100px;
background: blue;
}
.green{
height: 100px;
background: green;
}
Run Code Online (Sandbox Code Playgroud)
JS:
window.jQuery = window.$ = require('jquery');
slick = require('slick-carousel');
//DOM Ready
$(function(){
$('.slick').slick({
slidesToShow: 1,
speed: 300,
autoplay: true,
dots: true
});
});
Run Code Online (Sandbox Code Playgroud)
我迷失在这里,希望你们中的一个可以提供帮助.