最近在写项目中用到swiper做tab切换，因每个tab页的内容不一样，有的内容多，就会高一些，而有的内容少，会出现白屏，所以需要自适应高度，根绝官方API在swiper中添加 autoHeight: true ，但是并没有什么作用，第一

用代码测试

用代码测试

需用代码测试

效果用代码测试

选项卡五花八门，今天又要用到选项卡，首选swiper！一、HTML布局根据swiper官网的要求来class命名滑块。divclass=boxulclass=swiperTablispanDiv+CSS/span/lilispanJavaScript+JQuery/span/lilispanAngularJS+Vue+No

swiper禁止手动滑动只需要在最外层的容器上增加class=swiper-no-swiping（在引入了swiper相关css的前提下）

swiper3多个进行display:none切换时，会造成切换后无法自动播放和位移的情况用一下方法就可解决1、初始化添加observer: true,observerParents: true参数，解决位移或错位的问题var Swiper = new Swiper(".index", {loop: true,observer:true,observeParents:true,autoplay: 1000, //可选选项，自动滑动spaceBetween: 20,autoplayDis

用代码测试

基于swiper的自定义分页图文轮播图，代码有注释方便调用。

Swiper常用于移动端网站的内容触摸滑动Swiper是纯javascript打造的滑动特效插件，面向手机、平板电脑等移动终端。Swiper能实现触屏焦点图、触屏Tab切换、触屏多图切换等常用效果。Swiper开源、免费、稳定、使用简单、功能强大，是架构移动终端网站的重要选择！

swiper官方下载 3.4.2版本的基础包

Swiper对于各位前端的朋友实在是福音，不仅开源，最关键但是好用。Swiper地址：http://www.swiper.com.cn/最近因为项目上的需求，需要切换两个轮播图。于是出现了一个很尴尬的问题，第一个Swiper可以正常切换