小编Fer*_*las的帖子

光滑的旋转木马滑动显示在彼此的顶部

我正在尝试使用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)

我迷失在这里,希望你们中的一个可以提供帮助.

html css jquery roots-toolkit slick.js

1
推荐指数
1
解决办法
2403
查看次数

标签 统计

css ×1

html ×1

jquery ×1

roots-toolkit ×1

slick.js ×1