光滑滑块无法正确循环

Question

我有一个Slick滑块的问题，你可以在http://chriswickham.co.uk/startrek/看到

当滑块循环时，它会在拍摄回到第一张幻灯片之前暂时显示第一张幻灯片的子元素“hero__text”。 我无法弄清楚是什么导致了它。 任何帮助，将不胜感激。

HTML

    <div class="gd-1of1 hero">
        <div class="hero__slide" id="hero__1">
            <div class="hero__text">
                <h1>Top 10 Reasons You Should be Playing Star Trek Online</h1>
            </div>
        </div>
        <div class="hero__slide" id="hero__2">
            <div class="hero__text">
                <h1>Year of Hell: What Star Trek Voyager Should Have Been</h1>
            </div>
        </div>
        <div class="hero__slide" id="hero__3">
            <div class="hero__text">
                <h1>What we know about Star Trek Discovery so far.</h1>
            </div>
        </div>
    </div>

CSS / SASS

.hero{
    height:600px;
    width:100%;
  &__slide{
    height:600px;
    width:100%;
    position:relative;
  }
  &__text{
    width:100%;
    padding:20px;
    padding-bottom:50px;
    background: rgba(0,0,0,0.7);
    color:#FFF;
    position:absolute;
    bottom:0;
  }
}

JS

$(document).ready(function(){
  $(".hero").slick({
    slidesToShow: 1,
    slidesToScroll: 1,
    dots: true,
    autoplay: true,
    autoplaySpeed: 5000,
    arrows: false
  });
});    

Answer 1

改成：

  $(document).ready(function(){
      $(".hero").slick({
        slidesToShow: 1,
        slidesToScroll: 1,
        dots: true,
        autoplay: true,
        autoplaySpeed: 5000,
        arrows: false,
        infinite: true
      });
    });