Question

当使用淡入淡出时，有没有办法删除出现的FLASH：true？我的意思是我明白幻灯片的不透明度在更改时得到0和1，并且有一个点，两个幻灯片都有0.5不透明度，这样你就可以看到背景（白色），这使得过渡感觉就像有一个白色闪烁。我想不出一种方法来删除＆＃34;白色闪光＆＃34;，但给背景另一种颜色。但这仍然是一个闪光，但另一种颜色。

提前致谢，Marc

＆＃13;

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

＆＃13;

<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>

＆＃13;

Answer 1

我知道这是一个古老的问题，但是我只是想做同样的事情，并且遇到了。所以...经过一番挖掘，我遇到了“速度”参数，它是一个内置参数，可让您控制渐变速度。

您只需将速度设置为30（或0）
当滑块过渡到下一张幻灯片时，会给人以“不闪烁”的感觉。

示例：

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

希望这对某人有所帮助；）

Answer 2

让我们试试这个 css：transition: 变换 5 秒缓动，不透明度 1 秒缓出；

在光滑滑块渐变过渡中移除白色闪光

2 个答案: