Slick: Feature request: Initial Delay

[matthewlein]

I like this feature in other carousels/cycles. New option, delay. Number. An initial timeout that runs before you kick off your auto advance autoPlayTimer interval.

Use case is on page load, users need a few second(s) to orient themselves before a slider interval should kick in.

[simeydotme]

Here, I'll even take the opportunity to improve your UX :wink:

$(".slider").slick({
    autoplay: true,
    autoplaySpeed: 1000
}).slickPause();

var initialDelay = 3000;

$(document).one("mousemove touchstart", function() {
    setTimeout(function() {
        $(".slider").slickPlay();
    },initialDelay);
});

here's a JSFiddle to show you how: http://jsfiddle.net/p36wbk44/1/ :kiss:

[jan1980]

Guys, doesn't seem to work anymore in jsfiddle?

[simeydotme]

That's because the API methods changed. The logic is still sound.

$(".slider").slick({
    autoplay: true,
    autoplaySpeed: 1000
}).slick("pause");

var initialDelay = 3000;

$(document).one("mousemove touchstart", function() {
    setTimeout(function() {
        $(".slider").slick("play");
    },initialDelay);
});

[flowdee]

Method names changed. Currently it should look like:

var slider = $('.slider');

slider.slick({
    autoplay: true,
    autoplaySpeed: 1000
}).slick("slickPause");

var initialDelay = 3000;

setTimeout(function() {
    slider.slick("slickPlay");
},initialDelay);