Как задать задержку перед прокруткой слайда?

Question

[Максим]

Как задать задержку перед прокруткой слайда? В настройках slick slider не нашел. Может есть какой-то другой путь.

JS-код слайдера:

$(".intro__slider").slick({
    infinite: true,
    autoplay: true,
    autoplaySpeed: 6000,
    dots: true,
    dotsClass: "intro__dots",
    arrows: false
  });

  var introTitle = $(".intro__title"),
      introSlide = $(".intro__slide");

  $(".intro__slider").on("beforeChange", function () {
    introTitle.addClass("intro__title_hidden");
    introSlide.addClass("intro__slide_overlayed");
  });

  $(".intro__slider").on("afterChange", function () {
    introTitle.removeClass("intro__title_hidden");
    introSlide.removeClass("intro__slide_overlayed");
  });

Код на кодпене

Answer 1

[Можно просто Евгений]

А speed это не то что вам надо ?

либо при евенте "beforeChange" остановить его задать setTimeout и метод slickNext ...

Comments

[Максим]

speed не подходит, это скорость прокрутки, а не задержка перед прокруткой. 2ой вариант тоже не очень. А что, если мне нужно будет прокрутить назад?

[Можно просто Евгений]

Максим:

$('.your-element').on('swipe', function(event, slick, direction){
  console.log(direction);
  if direction === 'left' ? slickPrev : slickNext
});

Просто надо в какую то переменую поймать евент куда он свайпнул , и уже if/else тебе в помощь

[Можно просто Евгений]

Максим:

либо что-то вроде

$('.your-element').on('beforeChange', function(event, slick, currentSlide, nextSlide){
   var direction = (currentSlide < nextSlide) ? slickNext : slickPrev 
});

[Можно просто Евгений]

Максим:

$(".your-elementt").on('beforeChange', function (event, slick, currentSlide, nextSlide) {
  if (Math.abs(nextSlide - currentSlide) == 1) {
    direction = (nextSlide - currentSlide > 0) ? "right" : "left";
  }
  else {
    direction = (nextSlide - currentSlide > 0) ? "left" : "right";
  }
});

[Можно просто Евгений]

Можно просто Евгений:

Либо просто делаешь

$('.your-element').on('beforeChange', function(event, slick, currentSlide, nextSlide){
    slickGoTo(nextSlide)
});

и всё !!

[Максим]

Можно просто Евгений: понял, а как остановить слайдер-то?)

[Можно просто Евгений]

Максим:
не знаю , попробуй

var slider = $(".intro__slider").slick({ ... })

slider.slickSetOption("autoplay",false,false)

либо

event.preventDefault() в .on('beforechange') ...

щас нету времени тестировать , экспериментируй!