slick.js CSS更改幻灯片更改

Question

是否可以在slick.js滑块更改时更改div的css？基本上,如果滑块自动播放或从按钮单击,我想循环一组颜色并将.content的背景颜色设置为该颜色.我太疯了吗？

var colors = ['#576986', '#D0D5D6', '#DFDEE5'];

$('.content').css({'background': current i++});

查看演示jsfiddle

有任何想法吗？:)

Answer 1

Slick有活动,你可以在这里找到完整列表:https: //github.com/kenwheeler/slick

$(".slider").on("beforeChange", function (){
    //change color here
})

循环颜色:

var colors = ["red", "orange", "yellow", "green", "blue"];
var currentIndex = 0;

$(".slider").on("beforeChange", function (){
    $(".content").css("background-color", colors[currentIndex++%colors.length]);
});