Installation

> ⚠️ DO NOT use custom scrollbars unless you know what you are doing. Read more

> Tell us about the features you want in the next major update.

Via NPM (recommended):

``
npm install smooth-scrollbar --save
`

Via Bower:

`
bower install smooth-scrollbar --save
`

Browser Compatibility

| Browser | Version |
| :------ | :-----: |
| IE | 10+ |
| Chrome | 22+ |
| Firefox | 16+ |
| Safari | 8+ |
| Android Browser | 4+ |
| Chrome for Android | 32+ |
| iOS Safari | 7+ |

Demo

https://idiotwu.github.io/smooth-scrollbar/

Usage

Since this package has a pkg.module field, it's highly recommended to import it as an ES6 module with some bundlers like webpack or rollup:

`js
import Scrollbar from 'smooth-scrollbar';

Scrollbar.init(document.querySelector('#my-scrollbar'));
`

If you are not using any bundlers, you can just load the UMD bundle:

`html



`

Documentation

| latest | 7.x |
|----|----|

FAQ

- How to deal with position: fixed` elements? #362
- How to temporarily stop scrolling? #361
- How to enable hash/anchor scrolling? #360
- How to direct all scrolling to a particular direction? #359
- How to disable scrolling in a particular direction? #357
- more...

Who's Using It

- Awwwards Conference: An Event for UX / UI Designers and Web Developers.
- Listeners Playlist: A cool music player designed by Jiyong Ahn sharing musics from the facebook group 'Listeners Playlist'.
- Matter: A new and better way to grow your professional skills.
- Parsons Branding: Brand strategy and design studio based in Cape Town.
- zer0bin: Just a place to paste
- Feel free to add yours here 🤗.

Credits

- Logo by Kainoa Kanter (@ThatOneCalculator)

License

MIT

[npm-version-badge]: https://img.shields.io/npm/v/smooth-scrollbar.svg?style=for-the-badge
[npm-downloads-badge]: https://img.shields.io/npm/dm/smooth-scrollbar.svg?style=for-the-badge
[github-action-badge]: https://img.shields.io/github/actions/workflow/status/idiotWu/smooth-scrollbar/deploy.yml?branch=master&style=for-the-badge
[size-badge]: http://img.badgesize.io/idiotWu/smooth-scrollbar/master/dist/smooth-scrollbar.js?label=core%20size&style=for-the-badge
[gzip-size-badge]: http://img.badgesize.io/idiotWu/smooth-scrollbar/master/dist/smooth-scrollbar.js?label=gzip%20size&compression=gzip&style=for-the-badge
[gitpod-badge]: https://img.shields.io/badge/Gitpod-Ready--to--Code-blue?style=for-the-badge