微信小程序 - 自适应swiper高度（非组件）

 

 

 

 

 

微信小程序swiper默认高度375rpx，一旦超过这高度，就滑动不到内容了，我们利用css3可以很简单做到这件事情

 

原理：

利用css3 横轴滚动属性overflow:scroll,设置死swiper高度为100vh,这时会产生css3滚动条,隐藏掉swiper-item::-webkit-scrollbar 即可.

  

 

详情示例见：https://www.cnblogs.com/cisum/p/10443412.html

 

 

 

?

1 2 3 4 5 6 7 8 9 10 11 12 13 14

1 swiper {  2   width: 100%;  3   height: 100vh;  4   padding: 0;  5 }  6  7 swiper-item {  8   line-height: 350px;  9   overflow: scroll; 10 } 11 12 swiper-item::-webkit-scrollbar { 13   display: none; 14 }