javascript - 删除 Slick Slider 淡入淡出过渡中的白色闪光

Question

有没有办法在使用 fade: true 时去除出现的 FLASH？我的意思是我知道幻灯片的不透明度在更改时会变为 0 和 1，并且有一个点，两张幻灯片的不透明度均为 0.5，这样您就可以看到背景(白色)，这让过渡感觉像是有白色闪烁。我想不出一种方法来去除“白色闪光”，而是给背景另一种颜色。但这仍然会发出闪光，但颜色不同。

提前致谢，马克

  $('.home-slider').slick({
    draggable: true,
    autoplay: true,
    autoplaySpeed: 500,
    dots: true,
    fade: true,
    speed: 800,
    infinite: true,
    cssEase: 'ease-in-out',
    touchThreshold: 100
  })

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/slick-carousel/1.9.0/slick.js"></script>
<link href="https://cdnjs.cloudflare.com/ajax/libs/slick-carousel/1.9.0/slick.css" rel="stylesheet"/>



<div class="slideshow">
  <div class="home-slider">
    <div class="item">
      <img src="https://placeimg.com/640/480/nature" />
    </div>
    <div class="item">
      <img src="https://placeimg.com/640/480/animals" />
    </div>
  </div>
</div>

Answer 1

我知道这是一个老问题，但我只是想做同样的事情并遇到了它。所以......经过一点挖掘，我发现了“速度”参数，它是一个内置参数，可以让你控制淡入淡出的速度。

您可以简单地将速度设置为 30(或 0)
当 slider 过渡到下一张幻灯片时，这会给人一种“不闪烁”的感觉。

例子:

    $('#pplGallerySlider').slick({
        slidesToShow: 1,
        slidesToScroll: 1,
        arrows: false,
        fade: true,
        speed: 30,  // this is the line that matters
        infinite: false,
    });

希望这对某人有帮助；)