커스텀 스크롤바를 만들어주는 훌륭한 js 플러그인

오늘 소개해주고 싶은 js 플러그인은 커스텀 스크롤바를 만들어 주는 'mCustomScrollbar' 이라는 플러그인입니다. 먼저 알려드리자면 제 블로그의 히든영역에 적용되어 있는 스크롤바 입니다.

<현재 제 블로그에 이렇게 적용되어 있습니다.>

딱 보셔도 일반 스크롤바와는 많이 틀리시다는 것을 알 수 있습니다. 이 스크롤바는 브라우져가 기본적으로 제공해주는 것을 사용하지 않습니다. 

js를 뜯어서 대충 둘러보셔도 작동원리에 대한 감은 오는데, 일단 이 커스텀 스크롤바의 작동원리는 이렇습니다. 스크롤바가 생성되는 div의 높이 값을 계산해서 top 의 위치를 조절해 줌으로써 마치 스크롤바와 같은 효과를 얻습니다. 

'mCustomScrollbar' 플러그인은 스크립트로 짜여져 있는 커스텀 스크롤바이기 때문에 여러가지 장점이 존재합니다. 일단은 버튼으로 스크립트 펑션을 호출해서 위치조작이 가능하고, 오토 스크롤링이 가능합니다. 물론 스크롤바의 형태나 모양 역시 변경이 가능하며, 제이쿼리 기반이기 때문에 스크롤 바에 액션이 생겼을 때에 콜백 함수를 받아서 처리하는것 역시 가능합니다.

<mCustomScrollbar 배포 사이트 화면>

사이트 URL : http://manos.malihu.gr/jquery-custom-content-scroller/

<스크롤바 데모 페이지>

데모 페이지 URL : http://manos.malihu.gr/tuts/custom-scrollbar-plugin/complete_examples.html

개인적으로 강력 추천하는 js 플러그인이며, 호환은 익스 7 버젼부터 사용이 가능합니다. 사용 방법은 사이트에 충분한 예제와 설명으로 잘 나와 있습니다. ^.^ 그럼 즐거운 프로그래밍되시길 바랍니다. ^..^