滑动滑块上（'afterChange'）

Question

我正在尝试寻找选项或方法，使我能够在更改之前或之后更改活动滑块内容的动画。例如，我有一个名为“slider-header”的 Slick 滑块，里面有三个<h1>标签，如：

<div id="slider-header">
    <div>
        <h1>First header</h1>
        <h1>Second header</h1>
        <h1>Third header</h1>
    </div>
</div>

我想滑出（到左侧）第一个标题有一点延迟，然后第二个标题具有相同的延迟，第三个标题也是如此，然后我想更改下一张幻灯片。
在下一张幻灯片上更改后，我希望这些标题以相同的方式显示，但从另一侧显示。我只能使用setTimeout()函数和“slickNext”方法滑出到左侧，但我不知道如何让它们以相同的延迟方式从另一侧出现在下一张幻灯片上。

Answer 1

Slick 滑块有它自己的名为“afterChange”的事件，并且作为参数，它有 currentSlide 和 nextSlide 可以用来制作动画。

$('#slider-header > div').on('afterChange', function(event, slick, currentSlide, nextSlide){
    console.log(nextSlide);
});