Slim-scroll (JavaScript Scroll Library)

Slim scroll is a replacement of default scrollbar provided by browsers on Windows. This library lets you design the scroll-bar by using simple css properties. It is created using javascript and css. This will change the style only if the default scrollbar looks ugly.

Download  |  Github

Tested on: IE9+, Chrome and Firefox.

Demo

Main Features:

How to use:

and then:

Method 1 (with no added styles):
new slimScroll(Element);   // 'Element' is Javascript DOM object
Method 2 (with added styles):

or to add your own defined css styles:

new slimScroll(Element, {
  'wrapperClass': '',

  'scrollBarClass': '',

  'scrollBarContainerClass': '',  

  'scrollBarContainerSpecialClass': '',

  'scrollBarMinHeight': '',

  'scrollBarFixedHeight': '',

  'keepFocus': true/false
});

Explanation of above properties:

To make this work on height resize:

var customScroll = new slimScroll();
window.onresize = customScroll.resetValues;  // pure javascript example.

Note:

How I got this thought:

I got this thought, when I found solution to hide the default scrollbar (using css) which was the requirement for a post on Stackoverflow.

The solution was simple but that is how I got this thought :).

Future implementations:


If you find any issue(s), please file here.