swiper的使用以及切换过程中的内容高度留白问题

初始化组件
mySwiper = new Swiper('.swiper-container', {
   autoplay: false,//可选选项，自动滑动
   on:{
      slideChange: function(){           //当swiper切换时,下面是项目里需要用到的js
         nowTabIndex = this.activeIndex;
         $(".swiper-header").animate({scrollLeft:nowTabIndex*100},300);  //分类tab 切换效果
         $('#cate'+nowTabIndex).siblings().removeClass('active');
         $('#cate'+nowTabIndex).addClass('active');
         nowTabID = $('#cate'+nowTabIndex).data('category');
         nowPage = 1;
         noNext = false;
         $('#slide'+nowTabID).html('');   //清空缓存
         list();
      },
   },
   observer: true,//修改swiper自己或子元素时，自动初始化swiper
   observeParents: true,//修改swiper的父元素时，自动初始化swiper
});

 

关于滑动过程中，可能一些tab页面会有下拉刷新，导致切换到第二个swiper内容页时，高度还是上一个swiper内容里的高度，会造成留白等问题，只需要加css即可。

.swiper-slide{height:10px}
.swiper-slide-active { height:auto}

给swiper-sllide加高度，每次切换就可以重置height.