小程序隱藏scroll-view滾動條的實現 - 轉

以下兩種方法都可以

/*隱藏滾動條*/

::-webkit-scrollbar{

  width: 0;
  
  height: 0;
  
  color: transparent;

}

/*隱藏滾動條*/

::-webkit-scrollbar{

  display: none;

}

如果不行，還有以下方法：

傳送門

實現思路就是，在scroll-view外邊再包一個容器，它的高度小於scroll-view的高度，這樣就會截掉滾動條，達到隱藏了滾動條的效果。

// scss
.scroll-view-container { // 包裹scroll-view的容器
  height: $fakeScrollHeight;
  overflow: hidden; // 這個設置了就能截掉滾動條啦
  scroll-view {
   width: 100%;
   white-space: nowrap;
  }
 }

 .tab-container { // 我這里是用.tab-container來撐開scroll-view的高度，所以高度在它上面設置,加上padding，那么它就會比外層容器（.scroll-view-container）要高
  display: inline-block;
  width: 26%;
  height: $fakeScrollHeight;
  padding-bottom: $scrollBarHeight;
 }