본문 바로가기

카테고리 없음

웹페이지 스크롤바 없애기, 그에따른 대응방안

웹에서의 스크롤바는 자신이 어디까지 읽었는지, 어디쯤 왔는지 알 수 있는 용도에선 획기적이다.



하지만 다른 면으로 볼 때 (디자인적으로 후져서) 약간 거슬리기도 하고  블로거나 웹사이트 운영자라면 방문자가 내 웹공간에 더 머물도록 할 방법을 궁리해본적이 있을것이다.


스크롤바가 없다면 조금이나마 더욱 글에 집중하게 할 수 있다는 장점도 있지만 굳이 스크롤바가 없어야 그런 효과를 거둘 수 있는건 아니다.


요즘은 수직스크롤바가 아닌 수평스크롤바를 이용해서 상단에 작게나마 스크롤표시를 하는곳도 상당히 많이 봤는데, 일단 이 글에선 스크롤바를 없애는 기능에 대해서만 다루도록 하겠다.


body::-webkit-scrollbar {display: none;}


이 태그를 css안에 넣으면 스크롤바만 사라지게 할 수 있다.



하지만 이 태그도 역시 단점은 있다.


1) 안드로이드에선 적용이 안된다.

2) webkit기반의 브라우저에서만 적용된다. (크롬, 사파리 등등.... * 익스플로러는 당연히 적용안됨.)






이렇게 매우 간단한 방법이 아니더라도 어떤 방식으로든 스크롤바를 제거할수는 있지만 번거롭고 귀찮다.


그리고 태그를 이용해서 스크롤바를 숨길 수 있는 방법이 혹시 있을까 찾아봤지만 역시 대부분은 overflow:hidden태그로 어떻게 해보려고 한 바람에 스크롤바는 없애버렸지만 스크롤은 안되는....;


블로그를 버리겠다는 의도를 표출하는 현상이 발생해버린다.