WCAG Compliant Custom Scrollbar Plugin For jQuery - Scrollbox

WCAG Compliant Custom Scrollbar Plugin For jQuery - Scrollbox
File Size: 16.1 KB
Views Total: 1361
Last Update:
Publish Date:
Official Website: Go to website
License: MIT

scrollbox is an accessible and touch-enabled jQuery scrollbar plugin that creates a custom scrollbar on a scrollable element that is consistent across browsers, and is WCAG 2.0 compliant.

How to use it:

1. Link jQuery and the scrollbox plugin's script into your webpage by copying the following code snippets into your site:

<script src="//code.jquery.com/jquery.min.js"></script>
<script src="jquery.scrollbox.js"></script>

2. Call the function on the target element and we're done.


3. Customize the track and handle of the scrollbar by overriding the following CSS styles:

  track: {
    border:'1px solid #000000',
    width: '8px',
    height: (height - 2) +'px',
    position: 'absolute',
    top: '0',
    right: '0',
    borderRadius: '5px',
    opacity: 0.3
  handle: {
    background: '#000000',
    width: '8px',
    height: handleHeight +'px',
    cursor: 'pointer',
    borderRadius: '4px',
    transition: 'margin 85ms'

4. Destroy the plugin and remove all the scrollbars from DOM.


This awesome jQuery plugin is developed by marcnewport. For more Advanced Usages, please check the demo page or visit the official website.