小程序纵向选项卡可以滑动_微信小程序实现选项卡滑动切换

本文实例为大家分享了微信小程序实现选项卡滑动切换的具体代码，供大家参考，具体内容如下

先看效果:

再上代码:

1.index.wxml

哈哈

呵呵

嘿嘿

我是哈哈

我是呵呵

我是嘿嘿

2.index.wxss

/**index.wxss**/

.swiper-tab{

width: 100%;

border-bottom: 2rpx solid #777777;

text-align: center;

line-height: 80rpx;}

.swiper-tab-list{ font-size: 30rpx;

display: inline-block;

width: 33.33%;

color: #777777;

}

.on{ color: #da7c0c;

border-bottom: 5rpx solid #da7c0c;}

.swiper-box{ display: block; height: 100%; width: 100%; overflow: hidden; }

.swiper-box view{

text-align: center;

}

3.index.js

//index.js

//获取应用实例

var app = getApp()

Page( {

data: {

/**