微信小程序 - 自適應swiper高度（非組件）

 

 

 

 

 

微信小程序swiper默認高度375rpx，一旦超過這高度，就滑動不到內容了，我們利用css3可以很簡單做到這件事情

 

原理：

利用css3 橫軸滾動屬性overflow:scroll,設置死swiper高度為100vh,這時會產生css3滾動條,隱藏掉swiper-item::-webkit-scrollbar 即可.

  

 

詳情示例見：https://www.cnblogs.com/cisum/p/10443412.html

 

 

 

 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 }