I also open sourced a newer and more modern React version at: https://github.com/closeio/react-custom-scroller
It was developed with evergreen browsers in mind, but it works on IE11.
You can use this library as a script tag, or you can import it as a npm module, eg:
Or include it via jsDelivr CDN:
const SimpleScrollbar = require('simple-scrollbar'); require('simple-scrollbar/simple-scrollbar.css')
import SimpleScrollbar from 'simple-scrollbar' import 'simple-scrollbar/simple-scrollbar.css'
Include the attribute
that you want to make scrollable, and the library will turn it for youOneTwo
If you want to manually turn your div in a SimpleScrollbar, you can use theSimpleScrollbar.initElmethod.
Dynamically added content
If you use some client Framework, like Angular, Aurelia, etc - or any library that includes DOMElements dynamically in your app, and you want to use the SimpleScrollbarss-containerattribute, you can use theSimpleScrollbar.initAllmethod, and it will turn all the elements with that attribute in a scrollable one for you.var div = document.createElement('div'); div.insertAdjacentHTML('afterbegin', 'One'); div.setAttribute('ss-container', true);
var otherDiv = div.cloneNode(true); otherDiv.querySelector('span').textContent = 'Two';
Adddirection: rtl;to your's CSS, and SimpleScrollbar will detect the direction automatically.
Inspired by yairEO's jQuery plugin (fakescroll)