本文实例为大家分享了微信小程序实现滚动选项卡效果的具体代码，供大家参考，具体内容如下
效果图
YDUI的ScrollTab（滚动选项卡）
WXML
WXSS
.tui-fixed-y{
margin-left: 120px;
padding-left: 10px;
padding-right: 10px;
height: 100%;
position: fixed;
bottom: 0;
right: 0;
}
.tui-city-scroll-y{
height: 100%;
box-sizing: border-box;
}
.tui-list-head{
height: 50px;
line-height: 50px;
text-align: center;
font-size: 30rpx;
color: blue;
}
.tui-list-li{
height: 400px;
padding: 10rpx;
color: #fff;
font-size: 50rpx;
background-color: lightgreen;
}
margin-left: 120px;
padding-left: 10px;
padding-right: 10px;
height: 100%;
position: fixed;
bottom: 0;
right: 0;
}
.tui-city-scroll-y{
height: 100%;
box-sizing: border-box;
}
.tui-list-head{
height: 50px;
line-height: 50px;
text-align: center;
font-size: 30rpx;
color: blue;
}
.tui-list-li{
height: 400px;
padding: 10rpx;
color: #fff;
font-size: 50rpx;
background-color: lightgreen;
}
JS
总结
实现原理和处理方式都和一样，细微的差别在于WXSS样式表做了改变！
原文链接：https://www.f2er.com/weapp/33895.html