CSS 스크롤바 배경색을 투명하게 만들어보기 (짧)

저번 포스팅에 스크롤바 디자인을 해보았당

 

이번에는 스크롤바 배경색(scrollbar-track)을 투명하게 만들어보자

 

우선 before 스크롤바 상태

 

body::-webkit-scrollbar {
    width:8px;  /*스크롤바의 너비*/
}
body::-webkit-scrollbar-thumb {
    background-color:rgba(0,0,0,0.3); /*스크롤바의 색상*/
    border-radius: 250px;
}

여기서 스크롤바 트랙을 투명하게 만들고 싶어

구글링을 해보니 밑에 코드처럼 입력하라는 거임

body::-webkit-scrollbar-track {
    background: transparent; /*스크롤바 트랙 색상*/
}

결과는..........!!!!

 

 

 

똑같자나여....

 

다시 알아보니 다른 방법이 있었음

 

body{
    overflow: overlay;
}

 

스크롤바를 건드는게 아닌

body 의 overflow를 건드리면 되는거 였음

 

짜잔~ 간단하쥬~

 

이런 디테일한 부분을 알아가는 맛이 있쥐