Slick: Infinite loop false autoplay true

[kuamanet]

Hi,
i'm trying to set up a carousel with slider syncing ( one slider for image and a small one for thumb ) if i set "infinite: false" and "autoplay:xxxx" at slider ending slick start to iterate image in reverse mode: is there any solutions to start always from first slide?

[leggomuhgreggo]

You could capture the afterChange to test if it's the last slide and use the goTo method, I think

Hope that helps

Closing: support request

[kuamanet]

Hi @leggomuhgreggo thank you for your replay!

I've already tried to fire afterChange whit this snippet

$('.slick').on('afterChange', function(event, slick, currentSlide){ if(currentSlide == (slick.slideCount-1)){ console.log('restart from first'); $(this).slick('slickGoTo', 0, true); } });

but doesn't work :(

[fabiangigler]

Having still the same issue:
Is there no way to start from the first slide over when autoplay:true and infinite:false

[elsmolin]

This work for me

slickOptions: {
  ...
  infinite: false,
  autoplay: true
  ...
}

$('.js-slick').on('afterChange', function(event, slick, currentSlide) {
  const _last = slick.slideCount - slick.options.slidesToShow

  if (_last === currentSlide) {
    _slickItem.slick('slickPause')
    setTimeout(() => {
      _slickItem.slick('slickGoTo', 0, false)
      _slickItem.slick('slickPlay')
      setTimeout(() => {
        _slickItem.slick('refresh')
      }, _slickItem.slick('slickGetOption', 'speed'));
    }, 7000);
  }
})

[bloodberries]

This work for me

slickOptions: {
  ...
  infinite: false,
  autoplay: true
  ...
}

$('.js-slick').on('afterChange', function(event, slick, currentSlide) {
  const _last = slick.slideCount - slick.options.slidesToShow

  if (_last === currentSlide) {
    _slickItem.slick('slickPause')
    setTimeout(() => {
      _slickItem.slick('slickGoTo', 0, false)
      _slickItem.slick('slickPlay')
      setTimeout(() => {
        _slickItem.slick('refresh')
      }, _slickItem.slick('slickGetOption', 'speed'));
    }, 7000);
  }
})

Perfectly worked 👍 , can u explain why there's 7000 on the first setTimeout(), I mean what's the purpose of that value? I've implemented your code but there's no additional effect of 7000 value :/