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]);
});