[Slick.js] 実行完了後にautoplayなどのオプションを有効にする方法

状況

slick の実行完了のタイミングでautoplayを有効にしたい。

環境

• Slick.js - Version: 1.6.0

slickSetOption を使う

後付でオプションを設定する場合は、slickSetOptionを実行すれば良い。

$(".js-slick").slick("slickSetOption", "autoplay", true, true);

問題

タイミングとして、initのタイミングでオプションを指定したかった為、以下のような実装を行った。

$(".js-slick").on("init", function (event, slick) {
  $(this).slick("slickSetOption", "autoplay", true, true);
});

だが、このタイミングでslickSetOptionを実行しても、slickSetOptionが undefined となり処理できなかった。

解決

anyone still dealing with this: I seemed to have some success with wrapping my API call in a setTimeout(method, 0). Bummer of a bug.
Calling a method right after the “init” event causes an error · Issue #1802 · kenwheeler/slick · GitHub

参考に以下のような処理を行った。

$(".js-slick").on("init", function (event, slick) {
  var $self = $(this);
  setTimeout(function () {
    $self.slick("slickSetOption", "autoplay", true, true);
  }, 0);
});