Scrolly: fast vanilla JS scrollbar plugin

Monthly Downloads NPM Twitter

Aim is a fast + good looking scrollbar with zero dependencies, small size & major browsers support. So, the Browser Support is same as for MutationObserver, works in all modern browsers for Desktop and Mobile.

Install, via Bower or NPM

Features & Usage

// Initialize
var ids =|node|string, params);
// or
var id = scrolly.barNode(node, params);
// Body element is also supported
var id = scrolly.barNode(document.body, params);

// Update
// or update everything

// Dispose
// or cleanup everything

React Component

See example usage: gulp watch and open /react. Or just look at public/react/index.html in this repo.

<Scrolly params={ params }>
    <h1>Some test contents here</h1>
    <p>Contents to be scrolled...</p>

jQuery/Zepto/jBone Plugin flavour

// jQuery Plugin
// ...and it's chained as well

// Update

// Dispose


Just open public/index.html, or check the Live demo. For React Component demo check public/react/index.html or scrolly/react.


Data: DOM elements

data        LESS:
  wrap      .scrolly
  area        .area
  bar       .scrolly + .bar
  thumb       .thumb

Data: numbers


  1. Clone this repo.
  2. Install Node.js. Then Gulp: npm install -g gulp.
  3. Terminal, from project directory:
    • Dev dependencies: npm install.
    • gulp -T to see all available stuff.
    • gulp watch to run a local dev server, open in on localhost:3001.
    • gulp build-all to clean & build everything.