title: Swiper version 4 - fade transition for slides not working
body: <p>I have tried various fixes for this but have not had any luck.</p>
  
  <p>I want the slides to have a fade effect as well as have the whole slider autoplay. I have tried the examples found in the Swiper docs, following this example but with the latest swiper: <a href="https://codepen.io/michiel-huiskens/pen/WwqLew" rel="nofollow noreferrer">https://codepen.io/michiel-huiskens/pen/WwqLew</a>, following the example listed here from user YarGnawh: <a href="https://github.com/nolimits4web/swiper/issues/1177" rel="nofollow noreferrer">https://github.com/nolimits4web/swiper/issues/1177</a>, and a CSS fix mentioned in this thread: <a href="https://github.com/nolimits4web/swiper/issues/1098" rel="nofollow noreferrer">https://github.com/nolimits4web/swiper/issues/1098</a>. </p>
  
  <p>None of them worked, and I've tried various combinations, too, of parameters. Here is what I have now:
  <a href="https://codepen.io/gojiHime/pen/GVQgzm" rel="nofollow noreferrer">https://codepen.io/gojiHime/pen/GVQgzm</a></p>
  
  <pre><code>    var homeSwiper = new Swiper(".home-swiper-container", {
        fadeEffect: { crossFade: true },
        virtualTranslate: true,
        autoplay: 2500,
        speed: 1000,
        autoplayDisableOnInteraction: true,
        slidersPerView: 1,
        effect: "fade"
      });
  
  </code></pre>
  
  <p>It looks like it worked in older versions since this code pen works, and uses an older version: <a href="https://codepen.io/michiel-huiskens/pen/WwqLew" rel="nofollow noreferrer">https://codepen.io/michiel-huiskens/pen/WwqLew</a></p>
  
  <p>Any ideas? </p>