短视频app制作，停止滑动时，自动隐藏滚动条

短视频app制作，停止滑动时，自动隐藏滚动条实现的相关代码

1.首先我们找到项目的App.vue文件然后在style标签里面添加如下代码，这样一来，可以根据不同平台控制不同标签的属性。

 

1

<br><style><br>/*每个页面公共css */<br>/* 解决小程序和app滚动条的问题 */<br>/* #ifdef MP-WEIXIN || APP-PLUS */<br>::-webkit-scrollbar {<br>    display: none;<br>    width: 0 !important;<br>    height: 0 !important;<br>    -webkit-appearance: none;<br>    background: transparent;<br>    color: transparent;<br>  }<br>/* #endif */<br>/* 解决H5 的问题 */<br>/* #ifdef H5 */<br>    uni-scroll-view .uni-scroll-view::-webkit-scrollbar {<br>    /* 隐藏滚动条，但依旧具备可以滚动的功能 */<br>display: none;<br>    width: 0 !important;<br>    height: 0 !important;<br>    -webkit-appearance: none;<br>    background: transparent;<br>    color: transparent;<br>    }<br>/* #endif */<br></style>

​

2.我们还可以在App.vue的style里面外部链接base.css 这种办法可以控制所有的滚动条。

 

1	<br><style><br>/*每个页面公共css */<br>@import url("./src/assets/css/base.css");<br></style>

 

3.base.css代码如下

 

1	<br>::-webkit-scrollbar {<br>    display: none;<br>    width: 0 !important;<br>    height: 0 !important;<br>    -webkit-appearance: none;<br>    background: transparent;<br>    color: transparent;<br>  }

 

以上就是短视频app制作，停止滑动时，自动隐藏滚动条实现的相关代码， 更多内容欢迎关注之后的文章