반응형
앱 내에 웹뷰 방식으로 서비스를 런칭할일이 있는데, 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);
}
반응형
'웹프로그래밍 > CSS' 카테고리의 다른 글
iphone X 웹뷰 safe-area-inset 관련 (0) | 2020.07.08 |
---|---|
CSS overflow scrolling and hidden scrollbar (iOS) (0) | 2020.07.08 |
ios mobile 에서 터치시 background 색상 들어가는 문제 (0) | 2017.03.07 |
구글 Noto 한국어 글꼴을 웹에서 마음껏! (0) | 2016.05.24 |
IE에서 input text 박스 x 버튼 숨기기 (0) | 2015.09.08 |