theluyuan/layui
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

fix(scroll): 滚动条样式

Browse Source
This commit is contained in:
sight 2022-04-08 16:16:17 +08:00
parent 3f1399d1e5
commit f4b1234893
1 changed files with 12 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

21
package/component/src/component/scroll/index.vue
View File

@ -238,20 +238,16 @@ export default defineComponent({
overflow: hidden !important; overflow: hidden !important;
} }
.scrollbar-box ::-webkit-scrollbar {
width: 0px !important;
}
.scrollbar-y { .scrollbar-y {
position: relative; position: relative;
height: 100%; height: 100%;
.scroll-wrap { .scroll-wrap {
height: 100%; height: 100%;
overflow-y: scroll; overflow-y: scroll;
scrollbar-color: transparent transparent; scrollbar-width: none; /* firefox */
scrollbar-track-color: transparent; -ms-overflow-style: none;
-ms-scrollbar-track-color: transparent;
} }
.scrollbar-track { .scrollbar-track {
position: absolute; position: absolute;
top: 0; top: 0;
@ -266,12 +262,19 @@ export default defineComponent({
} }
} }
} }
.scrollbar-y ::-webkit-scrollbar{
display: none;
}
//移动端隐藏自定义滚动条 //移动端隐藏自定义滚动条
.hide.scrollbar-box .scrollbar-track { .hide.scrollbar-box .scrollbar-track {
display: none; display: none;
} }
//移动端显示原生滑块 //移动端显示原生滑块
.hide.scrollbar-box .scrollbar-y { .hide.scrollbar-box .scrollbar-y ::-webkit-scrollbar{
margin: 0; display: block;
}
.hide.scrollbar-box .scrollbar-y .scroll-wrap{
scrollbar-width: auto;
-ms-overflow-style: scrollbar;
} }
</style> </style>