Add 'handlers' option to configure scrolling methods

Please refer to README.md and examples/options-handlers.html for the
usage.
This commit is contained in:
Hyunje Alex Jun
2016-02-22 20:53:19 +09:00
parent 6f63623b93
commit bd7134f33d
5 changed files with 87 additions and 45 deletions

View File

@@ -283,61 +283,58 @@ imgLoader.perfectScrollbar();
perfect-scrollbar supports optional parameters.
### handlers
It is a list of handlers to use to scroll the element.
**Default**: `['click-rail', 'drag-scrollbar', 'keyboard', 'wheel', 'touch']`
**Disabled by default**: `'selection'`
### wheelSpeed
The scroll speed applied to mousewheel event.
**Default: 1**
**Default**: `1`
### wheelPropagation
If this option is true, when the scroll reaches the end of the side, mousewheel event will be propagated to parent element.
**Default: false**
**Default**: `false`
### swipePropagation
If this option is true, when the scroll reaches the end of the side, touch scrolling will be propagated to parent element.
**Default: true**
**Default**: `true`
### minScrollbarLength
When set to an integer value, the thumb part of the scrollbar will not shrink below that number of pixels.
**Default: null**
**Default**: `null`
### maxScrollbarLength
When set to an integer value, the thumb part of the scrollbar will not expand over that number of pixels.
**Default: null**
**Default**: `null`
### useBothWheelAxes
When set to true, and only one (vertical or horizontal) scrollbar is visible then both vertical and horizontal scrolling will affect the scrollbar.
**Default: false**
### useKeyboard
When set to true, the scroll works with arrow keys on the keyboard. The element is scrolled only when the mouse cursor hovers the element.
**Default: true**
**Default**: `false`
### suppressScrollX
When set to true, the scroll bar in X axis will not be available, regardless of the content width.
**Default: false**
**Default**: `false`
### suppressScrollY
When set to true, the scroll bar in Y axis will not be available, regardless of the content height.
**Default: false**
**Default**: `false`
### scrollXMarginOffset
The number of pixels the content width can surpass the container width without enabling the X axis scroll bar. Allows some "wiggle room" or "offset break", so that X axis scroll bar is not enabled just because of a few pixels.
**Default: 0**
**Default**: `0`
### scrollYMarginOffset
The number of pixels the content height can surpass the container height without enabling the Y axis scroll bar. Allows some "wiggle room" or "offset break", so that Y axis scroll bar is not enabled just because of a few pixels.
**Default: 0**
**Default**: `0`
### stopPropagationOnClick
When set to false, when clicking on a rail, the click event will be allowed to propagate.
**Default: true**
### useSelectionScroll
When set to true, you can scroll the container by selecting text and move the cursor.
**Default: false**
**Default**: `true`
### theme
A string. It's a class name added to the container element. The class name is prepended with `ps-theme-`. So default theme class name is `ps-theme-default`. In order to create custom themes with scss use `ps-container($theme)` mixin, where `$theme` is a scss map.
**Default: 'default'**
**Default**: `'default'`
**Example 1:**