1.waitEnteringScroll指的是滾動(dòng)容器的class
/*滾動(dòng)條寬高*/
.waitEnteringScroll::-webkit-scrollbar{
width: 8px;
height: 8px;
}
/*正常情況下滑塊的樣式*/
.waitEnteringScroll::-webkit-scrollbar-thumb{
background-color: rgba(0, 0, 0, .05);
border-radius: 10px;
}
/*鼠標(biāo)懸浮在該類指向的控件上時(shí)滑塊的樣式*/
.waitEnteringScroll:hover::-webkit-scrollbar-thumb{
background-color: rgba(0, 0, 0, .2);
border-radius: 10px;
box-shadow: inset 1px 1px 0 rgba(0, 0, 0, .1);
}
/*鼠標(biāo)懸浮在滑塊上時(shí)滑塊的樣式*/
.waitEnteringScroll::-webkit-scrollbar-thumb:hover{
background-color: rgba(0, 0, 0, .4);
box-shadow: inset 1px 1px 0 rgba(0, 0, 0, .1);
}
/*正常時(shí)候的主干部分*/
.waitEnteringScroll::-webkit-scrollbar-track{
border-radius: 10px;
box-shadow: inset 0 0 6px rgba(0, 0, 0, 0);
background-color: white;
}
/*鼠標(biāo)懸浮在滾動(dòng)條上的主干部分*/
.waitEnteringScroll::-webkit-scrollbar-track:hover{
box-shadow: inset 0 0 6px rgba(0, 0, 0, .4);
background-color: rgba(0, 0, 0, .01);
}