Minimal Custom Scrollbar Plugin For jQuery - mintScrollbar

File Size: 10.4 KB
Views Total: 3937
Last Update:
Publish Date:
Official Website: Go to website
License: MIT
   
Minimal Custom Scrollbar Plugin For jQuery - mintScrollbar

mintScrollbar is a minimal jQuery plugin to create custom scrollbars that feature vertical/horizontal/nested scrollbars, scroll to, scroll by, mouse wheel, keyboard and touch support etc.

Basic Usage:

1. Load the mintScrollbar.css for the basic & default scrollbar styles.

<link rel="stylesheet" href="mintScrollbar.css">

2. Load the jQuery mintScrollbar plugin after jQuery library.

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
<script src="jquery.mintScrollbar.min.js"></script>

3. Load the jQuery mousewheel plugin for mouse wheel support.

<script src="//cdnjs.cloudflare.com/ajax/libs/jquery-mousewheel/3.1.12/jquery.mousewheel.min.js"></script>

4. Call the plugin on the container element where you wish to display a custom scrollbar.

$(".demo").mintScrollbar();

5. All the default options.

$(".demo").mintScrollbar({

// onChange callback
onChange: null,

// custom axis
axis: "auto",

// mouse wheel speed
wheelSpeed: 120,

// disable on mobile devices
disableOnMobile: true

});

6. Public methods.

$(".demo").data("mintScrollbar").resize();
$(".demo").data("mintScrollbar").update();
$(".demo").data("mintScrollbar").destroy();

// scroll to functions
$(".demo").data("mintScrollbar").scrollTo(destX, destY);
$(".demo").data("mintScrollbar").scrollToX(destX);
$(".demo").data("mintScrollbar").scrollToY(destY);

// scroll by functions
$(".demo").data("mintScrollbar").scrollBy(deltaX, deltaY);
$(".demo").data("mintScrollbar").scrollByX(deltaX);
$(".demo").data("mintScrollbar").scrollByY(deltaY);
$(".demo").data("mintScrollbar").scrollByLines(lines);
$(".demo").data("mintScrollbar").scrollByPages(pages);

Change log:

2015-11-28

  • bugfix.

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