본문 바로가기

웹프로그래밍/CSS

안드로이드 웹뷰 스크롤바 안보일 때 (Android Webview scrollbar not visible, div overflow auto, scroll case)

반응형

앱 내에 웹뷰 방식으로 서비스를 런칭할일이 있는데, body scroll 이 아닌 div overflow auto 로 스크롤을 만들었는데 스크롤바가 나타나지 않았다. (어디서 영향을 준걸까...)

 

아래 css 코드를 적용하니 해결되었다. 스타일은 취향에 맞게 맞추면 된다.

 

 

::-webkit-scrollbar {
    width: 12px;
}     
::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.5); 
    -webkit-border-radius: 10px;
    border-radius: 10px;
}     
::-webkit-scrollbar-thumb {
    -webkit-border-radius: 10px;
    border-radius: 10px;
    background: rgba(255,0,0,0.8); 
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.5); 
}
::-webkit-scrollbar-thumb:window-inactive {
    background: rgba(255,0,0,0.4); 
}
반응형