Added 4 new setting options (suppressScrollX, suppressScrollY, scrollXMarginOffset and scrollYMarginOffset)
Added 4 new setting options (suppressScrollX, suppressScrollY, scrollXMarginOffset and scrollYMarginOffset)
This commit is contained in:
parent
ad0e1e4fab
commit
fa806adb55
16
README.md
16
README.md
@ -74,6 +74,22 @@ When set to true, and only one (vertical or horizontal) scrollbar is visible the
|
||||
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**
|
||||
|
||||
### suppressScrollX
|
||||
When set to true, the scroll bar in X axis will not be available, regardless of the content width
|
||||
**Default: false**
|
||||
|
||||
### suppressScrollY
|
||||
When set to true, the scroll bar in Y axis will not be available, regardless of the content height
|
||||
**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**
|
||||
|
||||
### 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**
|
||||
|
||||
How to Use
|
||||
----------
|
||||
|
||||
|
@ -18,7 +18,11 @@
|
||||
wheelPropagation: false,
|
||||
minScrollbarLength: null,
|
||||
useBothWheelAxes: false,
|
||||
useKeyboard: true
|
||||
useKeyboard: true,
|
||||
suppressScrollX: false,
|
||||
suppressScrollY: false,
|
||||
scrollXMarginOffset: 0,
|
||||
scrollYMarginOffset: 0
|
||||
};
|
||||
|
||||
$.fn.perfectScrollbar = function (suppliedSettings, option) {
|
||||
@ -99,8 +103,8 @@
|
||||
};
|
||||
|
||||
var updateScrollbarCss = function () {
|
||||
$scrollbarXRail.css({left: $this.scrollLeft(), bottom: scrollbarXBottom - $this.scrollTop(), width: containerWidth});
|
||||
$scrollbarYRail.css({top: $this.scrollTop(), right: scrollbarYRight - $this.scrollLeft(), height: containerHeight});
|
||||
$scrollbarXRail.css({left: $this.scrollLeft(), bottom: scrollbarXBottom - $this.scrollTop(), width: containerWidth, display: settings.suppressScrollX ? "none": "inherit"});
|
||||
$scrollbarYRail.css({top: $this.scrollTop(), right: scrollbarYRight - $this.scrollLeft(), height: containerHeight, display: settings.suppressScrollY ? "none": "inherit"});
|
||||
$scrollbarX.css({left: scrollbarXLeft, width: scrollbarXWidth});
|
||||
$scrollbarY.css({top: scrollbarYTop, height: scrollbarYHeight});
|
||||
};
|
||||
@ -111,7 +115,7 @@
|
||||
contentWidth = $this.prop('scrollWidth');
|
||||
contentHeight = $this.prop('scrollHeight');
|
||||
|
||||
if (containerWidth < contentWidth) {
|
||||
if (!settings.suppressScrollX && containerWidth + settings.scrollXMarginOffset < contentWidth) {
|
||||
scrollbarXActive = true;
|
||||
scrollbarXWidth = getSettingsAdjustedThumbSize(parseInt(containerWidth * containerWidth / contentWidth, 10));
|
||||
scrollbarXLeft = parseInt($this.scrollLeft() * (containerWidth - scrollbarXWidth) / (contentWidth - containerWidth), 10);
|
||||
@ -123,7 +127,7 @@
|
||||
$this.scrollLeft(0);
|
||||
}
|
||||
|
||||
if (containerHeight < contentHeight) {
|
||||
if (!settings.suppressScrollY && containerHeight + settings.scrollYMarginOffset < contentHeight) {
|
||||
scrollbarYActive = true;
|
||||
scrollbarYHeight = getSettingsAdjustedThumbSize(parseInt(containerHeight * containerHeight / contentHeight, 10));
|
||||
scrollbarYTop = parseInt($this.scrollTop() * (containerHeight - scrollbarYHeight) / (contentHeight - containerHeight), 10);
|
||||
|
Loading…
Reference in New Issue
Block a user