TheodorosPloumis's sandbox: Scrollbar

About

Scrollbar is a very simple Drupal module to implement the jScrollPane plugin functionality to your Drupal and make the elemenets of your body get a custom jquery scrollbar.

jScrollPane is a cross-browser jQuery plugin by Kelvin Luck (http://jscrollpane.kelvinluck.com) which converts a browser's default scrollbars (on elements with a relevant overflow property) into an HTML structure which can be easily skinned with CSS.

There is one more Drupal module using the same plugin: http://drupal.org/project/jscrollpane.

Scrollbar module will not be ported in 6.x version. It, also, uses a friendly UI with a lot of customizations.

Requirements

Libraries module

Installation

1. Donwload the module and extract it to the modules directory.
2. Go to the jScrollPane download page at http://jscrollpane.kelvinluck.com/index.html#download and then follow steps A to C below (B is optional).

A. Required files

1. Download file "jquery.jscrollpane.min.js" and place it in to libraries/scrollbar/js/jquery.jscrollpane.min.js (eg ../sites/all/libraries/scrollbar/js/jquery.jscrollpane.min.js)
2. Download file "jquery.jscrollpane.css" and place it in to libraries/scrollbar/css/jquery.jscrollpane.css (eg ../sites/all/libraries/scrollbar/css/jquery.jscrollpane.css)

B. Optional files

1. Download file "jquery.mousewheel.js" and place it in to libraries/scrollbar/js/jquery.mousewheel.js (eg ../sites/all/libraries/scrollbar/js/jquery.mousewheel.js)
2. Download file "mwheelIntent.js" and place it in to libraries/scrollbar/js/mwheelIntent.js (eg ../sites/all/libraries/scrollbar/js/mwheelIntent.js)

C. Theme settings

On your theme css add one or more styles for the element you want to get the custom jquery scrollbar.

For example, if you want to apply the .jScrollPane() function to the .field-name-body element just add this piece on your theme CSS

For more examples please refer to http://jscrollpane.kelvinluck.com/index.html#examples

Configuration

Go to admin/config/scrollbar and configure as you want.

For more information on how to use the jScrollPane() parameters please refer to the jScrollPage settings page (http://jscrollpane.kelvinluck.com/settings.html).

Gredits

Many thanks to Kelvin Luck (http://kelvinluck.com) for this excellant jquery plugin.