swiper 不能new 成功

前言

今天任务需要用swiper 做滑动，我就很简单的用滑动插件swiper 来做。但是很神奇的，我按照正常的流程写，但是滑动就是没有生效。
我的代码是这样的

<div id="step1">
</div>
<div id="step2" style="display:none;">
    <div class="swiper-container">
         <div class="swiper-wrapper">
                <div class="swiper-slide">Slide 1</div>
                <div class="swiper-slide">Slide 2</div>
                <div class="swiper-slide">Slide 3</div>
        </div>
    </div>
</div>

类似的 我需要在第一个div隐藏掉，第二个div 展示出来然后定义滑动。可是没有成功。

原因

找了很久发现是 div:display:none 的原因。。。

因此我单独做了测试：

<div id="one" style="display:none;">
         <div class="swiper-container">
            <div class="swiper-wrapper">
                <div class="swiper-slide">Slide 1</div>
                <div class="swiper-slide">Slide 2</div>
                <div class="swiper-slide">Slide 3</div>
                <div class="swiper-slide">Slide 4</div>
                <div class="swiper-slide">Slide 5</div>
                <div class="swiper-slide">Slide 6</div>
                <div class="swiper-slide">Slide 7</div>
                <div class="swiper-slide">Slide 8</div>
                <div class="swiper-slide">Slide 9</div>
                <div class="swiper-slide">Slide 10</div>
            </div>
            <!-- Add Pagination -->
            <div class="swiper-pagination"></div>
        </div>
    </div>
      var swiper = new Swiper('.swiper-container', {
        pagination: '.swiper-pagination',
        slidesPerView: 4,
        paginationClickable: true,
        spaceBetween: 40
     });
    $("#one").fadeIn();

这个就不能滑动

   $("#one").fadeIn();
      var swiper = new Swiper('.swiper-container', {
        pagination: '.swiper-pagination',
        slidesPerView: 4,
        paginationClickable: true,
        spaceBetween: 40
     });

这样就可以滑动。。

但是我自己的项目代码里面 先fadeIn() 也不能正常初始化。可能还有其他的坑。但是我已经知道，如果不用display:none . 就可以避开这个。

解决

div 原来等于 display:none 的 我都用opacity 和 z-index 实现，可以正常初始化我自己的swiper了。

但是我还是不知道为什么 display：none 就不能初始化成功。

而且我自己的代码 明明是先fadeIn() 的 还是会出现 初始化不成功的现象。所以还需要后观察。

但是可以确定，display:none 一定对 new swiper 有影响！！！