微信小程序swiper个性化定制

2016.11.11tabs切换，添加滑动动画。

/*/*/*/*/*/*/*/*/*//*/*/*/*/*/*/*/*/*//*/*/*/*/*/*/*/*/*//*/*/*/*/*/*/*/*/*//*/*/*/*/*/*/*/*/*//*/*/*/*/*/*/*/*/*/

2016.11.10日新增，tabs切换，点击菜单切换，滑动切换。

---------------------------------------------------------------------------------------------------------------------

微信小程序swiper个性化定制，微信已经提供的组件不能应付当前的开发需求。

因此，对微信小程序swiper的指示器做了下修改。

效果如下:

对样式文件即*.wxss文件做如下修改

 1 page .wx-swiper-dots.wx-swiper-dots-horizontal{
 2      margin-bottom: -4rpx;
 3 }
 4 
 5 page .wx-swiper-dot{
 6     width: 252rpx;
 7     display: inline-flex;
 8     height: 18rpx;
 9     vertical-align: sub;
10   
11 }
12 
13 
14 
15 
16 page .wx-swiper-dot::before{
17     content: '';
18     background: #e5e5e5;
19     flex-grow: 1;
20 }
21 
22 page .wx-swiper-dot-active::before{
23     content: '';
24     background:rgba(240,0,0,0.8);
25     flex-grow: 1;
26 }

源码地址如下：

https://github.com/toxufe/wx-swiper.git

https://git.coding.net/tongxiaodie/wx_swiper.git

本文欢迎转载，转载请注明出处，如果涉及侵权，请企鹅：723887809。