mirrors/OverlayScrollbars
2
0
Fork 0
mirror of https://github.com/tenrok/OverlayScrollbars.git synced 2026-06-24 10:50:38 +03:00
Code Issues Packages Projects Releases Wiki Activity

version 1.4.0

Browse Source
This commit is contained in:
Rene
2018-03-02 21:38:07 +01:00
parent 8bc44e9f0a
commit a29a279aba
8 changed files with 283 additions and 215 deletions
Download Patch File Download Diff File Expand all files Collapse all files
README.md
+1 -1
View File
@@ -212,7 +212,7 @@ Take the table below only as a overview of all options.
<td>autoHide</td> <td>autoHide</td>
<td>string</td> <td>string</td>
<td><code>"never"</code></td> <td><code>"never"</code></td>
<td>The possibility to hide visible scrollbars after a certain action.</td> <td>The possibility to hide visible scrollbars automatically after a certain action.</td>
</tr> </tr>
<tr> <tr>
<td></td> <td></td>
css/OverlayScrollbars.css
+2 -2
View File
@@ -2,13 +2,13 @@
* OverlayScrollbars * OverlayScrollbars
* https://github.com/KingSora/OverlayScrollbars * https://github.com/KingSora/OverlayScrollbars
* *
* Version: 1.3.0 * Version: 1.4.0
* *
* Copyright KingSora. * Copyright KingSora.
* https://github.com/KingSora * https://github.com/KingSora
* *
* Released under the MIT license. * Released under the MIT license.
* Date: 26.02.2018 * Date: 02.03.2018
*/ */
/* /*
css/OverlayScrollbars.min.css
Vendored
+2 -2
View File
File diff suppressed because one or more lines are too long
js/OverlayScrollbars.js
+71 -37
View File
@@ -2,13 +2,13 @@
* OverlayScrollbars * OverlayScrollbars
* https://github.com/KingSora/OverlayScrollbars * https://github.com/KingSora/OverlayScrollbars
* *
* Version: 1.3.0 * Version: 1.4.0
* *
* Copyright KingSora. * Copyright KingSora.
* https://github.com/KingSora * https://github.com/KingSora
* *
* Released under the MIT license. * Released under the MIT license.
* Date: 26.02.2018 * Date: 02.03.2018
*/ */
(function (global, factory) { (function (global, factory) {
@@ -1406,7 +1406,7 @@
}, },
scrollbars : { scrollbars : {
visibility : 'auto', //visible || hidden || auto || v || h || a visibility : 'auto', //visible || hidden || auto || v || h || a
autoHide : 'never', //never || scroll || leave || n || s || l autoHide : 'never', //never || scroll || leave || move || n || s || l || m
autoHideDelay : 800, //number autoHideDelay : 800, //number
dragScrolling : true, //true || false dragScrolling : true, //true || false
clickScrolling : false, //true || false clickScrolling : false, //true || false
@@ -1846,6 +1846,8 @@
var _strMouseTouchDownEvent = 'mousedown touchstart'; var _strMouseTouchDownEvent = 'mousedown touchstart';
var _strMouseTouchUpEvent = 'mouseup touchend'; var _strMouseTouchUpEvent = 'mouseup touchend';
var _strMouseTouchMoveEvent = 'mousemove touchmove'; var _strMouseTouchMoveEvent = 'mousemove touchmove';
var _strMouseTouchEnter = 'mouseenter';
var _strMouseTouchLeave = 'mouseleave';
var _strKeyDownEvent = 'keydown'; var _strKeyDownEvent = 'keydown';
var _strKeyUpEvent = 'keyup'; var _strKeyUpEvent = 'keyup';
var _strSelectStartEvent = 'selectstart'; var _strSelectStartEvent = 'selectstart';
@@ -1997,12 +1999,14 @@
//scrollbars: //scrollbars:
var _scrollbarsAutoHideTimeoutId; var _scrollbarsAutoHideTimeoutId;
var _scrollbarsAutoHideMoveTimeoutId;
var _scrollbarsAutoHideDelay; var _scrollbarsAutoHideDelay;
var _scrollbarsAutoHideNever; var _scrollbarsAutoHideNever;
var _scrollbarsAutoHideScroll; var _scrollbarsAutoHideScroll;
var _scrollbarsAutoHideMove;
var _scrollbarsAutoHideLeave; var _scrollbarsAutoHideLeave;
var _scrollbarsTouchSupport; var _scrollbarsTouchSupport;
var _scrollbarsAutoHideScrollAndHovered; var _scrollbarsAutoHideFlagScrollAndHovered;
//resize //resize
var _resizeReconnectMutationObserver; var _resizeReconnectMutationObserver;
@@ -2754,11 +2758,11 @@
else { else {
var strActive = 'active'; var strActive = 'active';
var hide = function () { var hide = function () {
if (!_scrollbarsAutoHideScrollAndHovered) { if (!_scrollbarsAutoHideFlagScrollAndHovered) {
var anyActive = _scrollbarHorizontalHandleElement.hasClass(strActive) || _scrollbarVerticalHandleElement.hasClass(strActive); var anyActive = _scrollbarHorizontalHandleElement.hasClass(strActive) || _scrollbarVerticalHandleElement.hasClass(strActive);
if (!anyActive && (_scrollbarsAutoHideScroll || _scrollbarsAutoHideLeave)) if (!anyActive && (_scrollbarsAutoHideScroll || _scrollbarsAutoHideMove || _scrollbarsAutoHideLeave))
_scrollbarHorizontalElement.addClass(_classNameScrollbarAutoHidden); _scrollbarHorizontalElement.addClass(_classNameScrollbarAutoHidden);
if (!anyActive && (_scrollbarsAutoHideScroll || _scrollbarsAutoHideLeave)) if (!anyActive && (_scrollbarsAutoHideScroll || _scrollbarsAutoHideMove || _scrollbarsAutoHideLeave))
_scrollbarVerticalElement.addClass(_classNameScrollbarAutoHidden); _scrollbarVerticalElement.addClass(_classNameScrollbarAutoHidden);
} }
}; };
@@ -2979,7 +2983,7 @@
event.clientY >= rect.top && event.clientY <= rect.bottom)) { event.clientY >= rect.top && event.clientY <= rect.bottom)) {
hostOnMouseLeave(); hostOnMouseLeave();
} }
if (_scrollbarsAutoHideScroll) if (_scrollbarsAutoHideScroll || _scrollbarsAutoHideMove)
refreshScrollbarsAutoHide(false); refreshScrollbarsAutoHide(false);
}; };
var documentKeyDown = function (event) { var documentKeyDown = function (event) {
@@ -3101,13 +3105,13 @@
compatibility.prvD(event); compatibility.prvD(event);
} }
}).hover(function () { //make sure both scrollbars will stay visible if one scrollbar is hovered if autoHide is "scroll". }).hover(function () { //make sure both scrollbars will stay visible if one scrollbar is hovered if autoHide is "scroll".
if (_scrollbarsAutoHideScroll) { if (_scrollbarsAutoHideScroll || _scrollbarsAutoHideMove) {
_scrollbarsAutoHideScrollAndHovered = true; _scrollbarsAutoHideFlagScrollAndHovered = true;
refreshScrollbarsAutoHide(true); refreshScrollbarsAutoHide(true);
} }
}, function () { }, function () {
if (_scrollbarsAutoHideScroll) { if (_scrollbarsAutoHideScroll || _scrollbarsAutoHideMove) {
_scrollbarsAutoHideScrollAndHovered = false; _scrollbarsAutoHideFlagScrollAndHovered = false;
refreshScrollbarsAutoHide(false); refreshScrollbarsAutoHide(false);
} }
}); });
@@ -3154,6 +3158,20 @@
refreshScrollbarsAutoHide(false); refreshScrollbarsAutoHide(false);
} }
/**
* The mouse leave event of the host element. This event is only needed for the autoHide feature.
*/
function hostOnMouseMove() {
if (_scrollbarsAutoHideMove) {
refreshScrollbarsAutoHide(true);
clearTimeout(_scrollbarsAutoHideMoveTimeoutId);
_scrollbarsAutoHideMoveTimeoutId = setTimeout(function () {
if (_scrollbarsAutoHideMove)
refreshScrollbarsAutoHide(false);
}, 100);
}
}
/** /**
* The scroll event of the viewport element. That is the main scroll event. It controls also the "scroll", "scrollStart" and "scrollStop" callbacks. * The scroll event of the viewport element. That is the main scroll event. It controls also the "scroll", "scrollStart" and "scrollStop" callbacks.
* @param event The scroll event. * @param event The scroll event.
@@ -3169,7 +3187,7 @@
if (_scrollStopTimeoutId !== undefined) if (_scrollStopTimeoutId !== undefined)
clearTimeout(_scrollStopTimeoutId); clearTimeout(_scrollStopTimeoutId);
else { else {
if (_scrollbarsAutoHideScroll) if (_scrollbarsAutoHideScroll || _scrollbarsAutoHideMove)
refreshScrollbarsAutoHide(true); refreshScrollbarsAutoHide(true);
if (!nativeOverlayScrollbarsAreActive()) if (!nativeOverlayScrollbarsAreActive())
@@ -3199,7 +3217,7 @@
function onScrollStop() { function onScrollStop() {
clearTimeout(_scrollStopTimeoutId); clearTimeout(_scrollStopTimeoutId);
_scrollStopTimeoutId = undefined; _scrollStopTimeoutId = undefined;
if (_scrollbarsAutoHideScroll) if (_scrollbarsAutoHideScroll || _scrollbarsAutoHideMove)
refreshScrollbarsAutoHide(false); refreshScrollbarsAutoHide(false);
if (!nativeOverlayScrollbarsAreActive()) if (!nativeOverlayScrollbarsAreActive())
@@ -3534,7 +3552,7 @@
var classNameAllowedValues = ['*', null]; var classNameAllowedValues = ['*', null];
var overflowBehaviorAllowedValues = ['v-h:visible-hidden', 'v-s:visible-scroll', 's:scroll', 'h:hidden']; var overflowBehaviorAllowedValues = ['v-h:visible-hidden', 'v-s:visible-scroll', 's:scroll', 'h:hidden'];
var scrollbarsVisibilityAllowedValues = ['v:visible', 'h:hidden', 'a:auto']; var scrollbarsVisibilityAllowedValues = ['v:visible', 'h:hidden', 'a:auto'];
var scrollbarsAutoHideAllowedValues = ['n:never', 's:scroll', 'l:leave']; var scrollbarsAutoHideAllowedValues = ['n:never', 's:scroll', 'l:leave', 'm:move'];
var resizeAllowedValues = ['n:none', 'b:both', 'h:horizontal', 'v:vertical']; var resizeAllowedValues = ['n:none', 'b:both', 'h:horizontal', 'v:vertical'];
var strCallbacksDot = 'callbacks.'; var strCallbacksDot = 'callbacks.';
var strScrollbarsDot = _strScrollbar + 's.'; var strScrollbarsDot = _strScrollbar + 's.';
@@ -3899,6 +3917,7 @@
//scrollbars visibility //scrollbars visibility
_scrollbarsAutoHideNever = scrollbarsAutoHide === 'n'; _scrollbarsAutoHideNever = scrollbarsAutoHide === 'n';
_scrollbarsAutoHideScroll = scrollbarsAutoHide === 's'; _scrollbarsAutoHideScroll = scrollbarsAutoHide === 's';
_scrollbarsAutoHideMove = scrollbarsAutoHide === 'm';
_scrollbarsAutoHideLeave = scrollbarsAutoHide === 'l'; _scrollbarsAutoHideLeave = scrollbarsAutoHide === 'l';
//scrollbars autoHideDelay //scrollbars autoHideDelay
@@ -4236,7 +4255,12 @@
var strOverflowY = strOverflow + '-y'; var strOverflowY = strOverflow + '-y';
var strHidden = 'hidden'; var strHidden = 'hidden';
var strVisible = 'visible'; var strVisible = 'visible';
var hideOverflow4CorrectMeasuring = _restrictedMeasuring ? (_nativeScrollbarIsOverlaid.x || _nativeScrollbarIsOverlaid.y) || (_viewportSize.w < _nativeScrollbarMinSize.y || _viewportSize.h < _nativeScrollbarMinSize.x) : false;; //decide whether the content overflow must get hidden for correct overflow measuring, it MUST be always hidden if the height is auto
var hideOverflow4CorrectMeasuring = _restrictedMeasuring ?
(_nativeScrollbarIsOverlaid.x || _nativeScrollbarIsOverlaid.y) || //it must be hidden if native scrollbars are overlaid
(_viewportSize.w < _nativeScrollbarMinSize.y || _viewportSize.h < _nativeScrollbarMinSize.x) || //it must be hidden if host-element is too small
heightAuto //it must be hidden if height is auto
: heightAuto; //if there is not the restricted Measuring bug, it must be hidden if the height is auto
//Reset the viewport (very important for natively overlaid scrollbars and zoom change //Reset the viewport (very important for natively overlaid scrollbars and zoom change
var viewportElementResetCSS = {}; var viewportElementResetCSS = {};
@@ -4251,7 +4275,7 @@
//measure several sizes: //measure several sizes:
var contentMeasureElement = getContentMeasureElement(); var contentMeasureElement = getContentMeasureElement();
//in Firefox content element has to have overflow hidden, else element margins aren't calculated properly, this element prevents this bug, but only if scrollbars aren't overlaid //in Firefox content element has to have overflow hidden, else element margins aren't calculated properly, this element prevents this bug, but only if scrollbars aren't overlaid
var contentMeasureElementGuaranty = hideOverflow4CorrectMeasuring ? contentMeasureElement : _viewportElement[0]; var contentMeasureElementGuaranty = _restrictedMeasuring && !hideOverflow4CorrectMeasuring ? _viewportElement[0] : contentMeasureElement;
var clientSize = { var clientSize = {
w: contentMeasureElement[WORDING.cW], w: contentMeasureElement[WORDING.cW],
h: contentMeasureElement[WORDING.cH] h: contentMeasureElement[WORDING.cH]
@@ -4696,34 +4720,42 @@
//manage the scrollbars auto hide feature (auto hide them after specific actions) //manage the scrollbars auto hide feature (auto hide them after specific actions)
if (scrollbarsAutoHideChanged || ignoreOverlayScrollbarHidingChanged) { if (scrollbarsAutoHideChanged || ignoreOverlayScrollbarHidingChanged) {
var strMouseEnter = 'mouseenter'; var addMouseTouchEvents = function (move) {
var strMouseLeave = 'mouseleave';
var addLeaveEvents = function () {
if (_supportPassiveEvents) { if (_supportPassiveEvents) {
addPassiveEventListener(_hostElement, strMouseEnter, hostOnMouseEnter); if(move)
addPassiveEventListener(_hostElement, strMouseLeave, hostOnMouseLeave); addPassiveEventListener(_hostElement, _strMouseTouchMoveEvent, hostOnMouseMove);
else {
addPassiveEventListener(_hostElement, _strMouseTouchEnter, hostOnMouseEnter);
addPassiveEventListener(_hostElement, _strMouseTouchLeave, hostOnMouseLeave);
}
} }
else { else {
_hostElement.on(strMouseEnter, hostOnMouseEnter); if(move)
_hostElement.on(strMouseLeave, hostOnMouseLeave); _hostElement.on(_strMouseTouchMoveEvent, hostOnMouseMove);
else {
_hostElement.on(_strMouseTouchEnter, hostOnMouseEnter);
_hostElement.on(_strMouseTouchLeave, hostOnMouseLeave);
}
} }
}; };
var removeLeaveEvents = function () { var removeMouseTouchEvents = function () {
if (_supportPassiveEvents) { if (_supportPassiveEvents) {
removePassiveEventListener(_hostElement, strMouseEnter, hostOnMouseEnter); removePassiveEventListener(_hostElement, _strMouseTouchMoveEvent, hostOnMouseMove);
removePassiveEventListener(_hostElement, strMouseLeave, hostOnMouseLeave); removePassiveEventListener(_hostElement, _strMouseTouchEnter, hostOnMouseEnter);
removePassiveEventListener(_hostElement, _strMouseTouchLeave, hostOnMouseLeave);
} }
else { else {
_hostElement.off(strMouseEnter, hostOnMouseEnter); _hostElement.off(_strMouseTouchMoveEvent, hostOnMouseMove);
_hostElement.off(strMouseLeave, hostOnMouseLeave); _hostElement.off(_strMouseTouchEnter, hostOnMouseEnter);
_hostElement.off(_strMouseTouchLeave, hostOnMouseLeave);
} }
}; };
if (_scrollbarsAutoHideLeave) { if (_scrollbarsAutoHideLeave || _scrollbarsAutoHideMove) {
removeLeaveEvents(); removeMouseTouchEvents();
addLeaveEvents(); addMouseTouchEvents(_scrollbarsAutoHideMove);
} }
else { else {
removeLeaveEvents(); removeMouseTouchEvents();
} }
if (_scrollbarsAutoHideNever) if (_scrollbarsAutoHideNever)
@@ -4939,12 +4971,14 @@
_sizeAutoObserverElement.remove(); _sizeAutoObserverElement.remove();
if (_supportPassiveEvents) { if (_supportPassiveEvents) {
removePassiveEventListener(_hostElement, 'mouseenter', hostOnMouseEnter); removePassiveEventListener(_hostElement, _strMouseTouchMoveEvent, hostOnMouseMove);
removePassiveEventListener(_hostElement, 'mouseleave', hostOnMouseLeave); removePassiveEventListener(_hostElement, _strMouseTouchEnter, hostOnMouseEnter);
removePassiveEventListener(_hostElement, _strMouseTouchLeave, hostOnMouseLeave);
} }
else { else {
_hostElement.off('mouseenter', hostOnMouseEnter); _hostElement.off(_strMouseTouchMoveEvent, hostOnMouseMove);
_hostElement.off('mouseleave', hostOnMouseLeave); _hostElement.off(_strMouseTouchEnter, hostOnMouseEnter);
_hostElement.off(_strMouseTouchLeave, hostOnMouseLeave);
} }
_scrollbarHorizontalElement.remove(); _scrollbarHorizontalElement.remove();
js/OverlayScrollbars.min.js
Vendored
+3 -3
View File
File diff suppressed because one or more lines are too long
js/jquery.overlayScrollbars.js
+71 -37
View File
@@ -2,13 +2,13 @@
* OverlayScrollbars * OverlayScrollbars
* https://github.com/KingSora/OverlayScrollbars * https://github.com/KingSora/OverlayScrollbars
* *
* Version: 1.3.0 * Version: 1.4.0
* *
* Copyright KingSora. * Copyright KingSora.
* https://github.com/KingSora * https://github.com/KingSora
* *
* Released under the MIT license. * Released under the MIT license.
* Date: 26.02.2018 * Date: 02.03.2018
*/ */
(function (global, factory) { (function (global, factory) {
@@ -435,7 +435,7 @@
}, },
scrollbars : { scrollbars : {
visibility : 'auto', //visible || hidden || auto || v || h || a visibility : 'auto', //visible || hidden || auto || v || h || a
autoHide : 'never', //never || scroll || leave || n || s || l autoHide : 'never', //never || scroll || leave || move || n || s || l || m
autoHideDelay : 800, //number autoHideDelay : 800, //number
dragScrolling : true, //true || false dragScrolling : true, //true || false
clickScrolling : false, //true || false clickScrolling : false, //true || false
@@ -875,6 +875,8 @@
var _strMouseTouchDownEvent = 'mousedown touchstart'; var _strMouseTouchDownEvent = 'mousedown touchstart';
var _strMouseTouchUpEvent = 'mouseup touchend'; var _strMouseTouchUpEvent = 'mouseup touchend';
var _strMouseTouchMoveEvent = 'mousemove touchmove'; var _strMouseTouchMoveEvent = 'mousemove touchmove';
var _strMouseTouchEnter = 'mouseenter';
var _strMouseTouchLeave = 'mouseleave';
var _strKeyDownEvent = 'keydown'; var _strKeyDownEvent = 'keydown';
var _strKeyUpEvent = 'keyup'; var _strKeyUpEvent = 'keyup';
var _strSelectStartEvent = 'selectstart'; var _strSelectStartEvent = 'selectstart';
@@ -1026,12 +1028,14 @@
//scrollbars: //scrollbars:
var _scrollbarsAutoHideTimeoutId; var _scrollbarsAutoHideTimeoutId;
var _scrollbarsAutoHideMoveTimeoutId;
var _scrollbarsAutoHideDelay; var _scrollbarsAutoHideDelay;
var _scrollbarsAutoHideNever; var _scrollbarsAutoHideNever;
var _scrollbarsAutoHideScroll; var _scrollbarsAutoHideScroll;
var _scrollbarsAutoHideMove;
var _scrollbarsAutoHideLeave; var _scrollbarsAutoHideLeave;
var _scrollbarsTouchSupport; var _scrollbarsTouchSupport;
var _scrollbarsAutoHideScrollAndHovered; var _scrollbarsAutoHideFlagScrollAndHovered;
//resize //resize
var _resizeReconnectMutationObserver; var _resizeReconnectMutationObserver;
@@ -1783,11 +1787,11 @@
else { else {
var strActive = 'active'; var strActive = 'active';
var hide = function () { var hide = function () {
if (!_scrollbarsAutoHideScrollAndHovered) { if (!_scrollbarsAutoHideFlagScrollAndHovered) {
var anyActive = _scrollbarHorizontalHandleElement.hasClass(strActive) || _scrollbarVerticalHandleElement.hasClass(strActive); var anyActive = _scrollbarHorizontalHandleElement.hasClass(strActive) || _scrollbarVerticalHandleElement.hasClass(strActive);
if (!anyActive && (_scrollbarsAutoHideScroll || _scrollbarsAutoHideLeave)) if (!anyActive && (_scrollbarsAutoHideScroll || _scrollbarsAutoHideMove || _scrollbarsAutoHideLeave))
_scrollbarHorizontalElement.addClass(_classNameScrollbarAutoHidden); _scrollbarHorizontalElement.addClass(_classNameScrollbarAutoHidden);
if (!anyActive && (_scrollbarsAutoHideScroll || _scrollbarsAutoHideLeave)) if (!anyActive && (_scrollbarsAutoHideScroll || _scrollbarsAutoHideMove || _scrollbarsAutoHideLeave))
_scrollbarVerticalElement.addClass(_classNameScrollbarAutoHidden); _scrollbarVerticalElement.addClass(_classNameScrollbarAutoHidden);
} }
}; };
@@ -1808,7 +1812,6 @@
//get and apply intended handle length //get and apply intended handle length
var handleRatio = Math.min(1, (_hostSizeCache[scrollbarVars._wh] - (_paddingAbsoluteCache ? (isHorizontal ? _paddingX : _paddingY) : 0)) / _contentScrollSizeCache[scrollbarVars._wh]); var handleRatio = Math.min(1, (_hostSizeCache[scrollbarVars._wh] - (_paddingAbsoluteCache ? (isHorizontal ? _paddingX : _paddingY) : 0)) / _contentScrollSizeCache[scrollbarVars._wh]);
handleRatio = isNaN(handleRatio) ? 0 : handleRatio;
handleCSS[scrollbarVars.wh] = (Math.floor(handleRatio * 100 * 100000) / 100000) + "%"; //the last * 100000 / 100000 is for flooring to the 4th digit handleCSS[scrollbarVars.wh] = (Math.floor(handleRatio * 100 * 100000) / 100000) + "%"; //the last * 100000 / 100000 is for flooring to the 4th digit
if (!nativeOverlayScrollbarsAreActive()) if (!nativeOverlayScrollbarsAreActive())
@@ -2009,7 +2012,7 @@
event.clientY >= rect.top && event.clientY <= rect.bottom)) { event.clientY >= rect.top && event.clientY <= rect.bottom)) {
hostOnMouseLeave(); hostOnMouseLeave();
} }
if (_scrollbarsAutoHideScroll) if (_scrollbarsAutoHideScroll || _scrollbarsAutoHideMove)
refreshScrollbarsAutoHide(false); refreshScrollbarsAutoHide(false);
}; };
var documentKeyDown = function (event) { var documentKeyDown = function (event) {
@@ -2131,13 +2134,13 @@
compatibility.prvD(event); compatibility.prvD(event);
} }
}).hover(function () { //make sure both scrollbars will stay visible if one scrollbar is hovered if autoHide is "scroll". }).hover(function () { //make sure both scrollbars will stay visible if one scrollbar is hovered if autoHide is "scroll".
if (_scrollbarsAutoHideScroll) { if (_scrollbarsAutoHideScroll || _scrollbarsAutoHideMove) {
_scrollbarsAutoHideScrollAndHovered = true; _scrollbarsAutoHideFlagScrollAndHovered = true;
refreshScrollbarsAutoHide(true); refreshScrollbarsAutoHide(true);
} }
}, function () { }, function () {
if (_scrollbarsAutoHideScroll) { if (_scrollbarsAutoHideScroll || _scrollbarsAutoHideMove) {
_scrollbarsAutoHideScrollAndHovered = false; _scrollbarsAutoHideFlagScrollAndHovered = false;
refreshScrollbarsAutoHide(false); refreshScrollbarsAutoHide(false);
} }
}); });
@@ -2184,6 +2187,20 @@
refreshScrollbarsAutoHide(false); refreshScrollbarsAutoHide(false);
} }
/**
* The mouse leave event of the host element. This event is only needed for the autoHide feature.
*/
function hostOnMouseMove() {
if (_scrollbarsAutoHideMove) {
refreshScrollbarsAutoHide(true);
clearTimeout(_scrollbarsAutoHideMoveTimeoutId);
_scrollbarsAutoHideMoveTimeoutId = setTimeout(function () {
if (_scrollbarsAutoHideMove)
refreshScrollbarsAutoHide(false);
}, 100);
}
}
/** /**
* The scroll event of the viewport element. That is the main scroll event. It controls also the "scroll", "scrollStart" and "scrollStop" callbacks. * The scroll event of the viewport element. That is the main scroll event. It controls also the "scroll", "scrollStart" and "scrollStop" callbacks.
* @param event The scroll event. * @param event The scroll event.
@@ -2199,7 +2216,7 @@
if (_scrollStopTimeoutId !== undefined) if (_scrollStopTimeoutId !== undefined)
clearTimeout(_scrollStopTimeoutId); clearTimeout(_scrollStopTimeoutId);
else { else {
if (_scrollbarsAutoHideScroll) if (_scrollbarsAutoHideScroll || _scrollbarsAutoHideMove)
refreshScrollbarsAutoHide(true); refreshScrollbarsAutoHide(true);
if (!nativeOverlayScrollbarsAreActive()) if (!nativeOverlayScrollbarsAreActive())
@@ -2229,7 +2246,7 @@
function onScrollStop() { function onScrollStop() {
clearTimeout(_scrollStopTimeoutId); clearTimeout(_scrollStopTimeoutId);
_scrollStopTimeoutId = undefined; _scrollStopTimeoutId = undefined;
if (_scrollbarsAutoHideScroll) if (_scrollbarsAutoHideScroll || _scrollbarsAutoHideMove)
refreshScrollbarsAutoHide(false); refreshScrollbarsAutoHide(false);
if (!nativeOverlayScrollbarsAreActive()) if (!nativeOverlayScrollbarsAreActive())
@@ -2564,7 +2581,7 @@
var classNameAllowedValues = ['*', null]; var classNameAllowedValues = ['*', null];
var overflowBehaviorAllowedValues = ['v-h:visible-hidden', 'v-s:visible-scroll', 's:scroll', 'h:hidden']; var overflowBehaviorAllowedValues = ['v-h:visible-hidden', 'v-s:visible-scroll', 's:scroll', 'h:hidden'];
var scrollbarsVisibilityAllowedValues = ['v:visible', 'h:hidden', 'a:auto']; var scrollbarsVisibilityAllowedValues = ['v:visible', 'h:hidden', 'a:auto'];
var scrollbarsAutoHideAllowedValues = ['n:never', 's:scroll', 'l:leave']; var scrollbarsAutoHideAllowedValues = ['n:never', 's:scroll', 'l:leave', 'm:move'];
var resizeAllowedValues = ['n:none', 'b:both', 'h:horizontal', 'v:vertical']; var resizeAllowedValues = ['n:none', 'b:both', 'h:horizontal', 'v:vertical'];
var strCallbacksDot = 'callbacks.'; var strCallbacksDot = 'callbacks.';
var strScrollbarsDot = _strScrollbar + 's.'; var strScrollbarsDot = _strScrollbar + 's.';
@@ -2929,6 +2946,7 @@
//scrollbars visibility //scrollbars visibility
_scrollbarsAutoHideNever = scrollbarsAutoHide === 'n'; _scrollbarsAutoHideNever = scrollbarsAutoHide === 'n';
_scrollbarsAutoHideScroll = scrollbarsAutoHide === 's'; _scrollbarsAutoHideScroll = scrollbarsAutoHide === 's';
_scrollbarsAutoHideMove = scrollbarsAutoHide === 'm';
_scrollbarsAutoHideLeave = scrollbarsAutoHide === 'l'; _scrollbarsAutoHideLeave = scrollbarsAutoHide === 'l';
//scrollbars autoHideDelay //scrollbars autoHideDelay
@@ -3266,7 +3284,12 @@
var strOverflowY = strOverflow + '-y'; var strOverflowY = strOverflow + '-y';
var strHidden = 'hidden'; var strHidden = 'hidden';
var strVisible = 'visible'; var strVisible = 'visible';
var hideOverflow4CorrectMeasuring = _restrictedMeasuring ? (_nativeScrollbarIsOverlaid.x || _nativeScrollbarIsOverlaid.y) || (_viewportSize.w < _nativeScrollbarMinSize.y || _viewportSize.h < _nativeScrollbarMinSize.x) : false; //decide whether the content overflow must get hidden for correct overflow measuring, it MUST be always hidden if the height is auto
var hideOverflow4CorrectMeasuring = _restrictedMeasuring ?
(_nativeScrollbarIsOverlaid.x || _nativeScrollbarIsOverlaid.y) || //it must be hidden if native scrollbars are overlaid
(_viewportSize.w < _nativeScrollbarMinSize.y || _viewportSize.h < _nativeScrollbarMinSize.x) || //it must be hidden if host-element is too small
heightAuto //it must be hidden if height is auto
: heightAuto; //if there is not the restricted Measuring bug, it must be hidden if the height is auto
//Reset the viewport (very important for natively overlaid scrollbars and zoom change //Reset the viewport (very important for natively overlaid scrollbars and zoom change
var viewportElementResetCSS = {}; var viewportElementResetCSS = {};
@@ -3726,34 +3749,42 @@
//manage the scrollbars auto hide feature (auto hide them after specific actions) //manage the scrollbars auto hide feature (auto hide them after specific actions)
if (scrollbarsAutoHideChanged || ignoreOverlayScrollbarHidingChanged) { if (scrollbarsAutoHideChanged || ignoreOverlayScrollbarHidingChanged) {
var strMouseEnter = 'mouseenter'; var addMouseTouchEvents = function (move) {
var strMouseLeave = 'mouseleave';
var addLeaveEvents = function () {
if (_supportPassiveEvents) { if (_supportPassiveEvents) {
addPassiveEventListener(_hostElement, strMouseEnter, hostOnMouseEnter); if(move)
addPassiveEventListener(_hostElement, strMouseLeave, hostOnMouseLeave); addPassiveEventListener(_hostElement, _strMouseTouchMoveEvent, hostOnMouseMove);
else {
addPassiveEventListener(_hostElement, _strMouseTouchEnter, hostOnMouseEnter);
addPassiveEventListener(_hostElement, _strMouseTouchLeave, hostOnMouseLeave);
}
} }
else { else {
_hostElement.on(strMouseEnter, hostOnMouseEnter); if(move)
_hostElement.on(strMouseLeave, hostOnMouseLeave); _hostElement.on(_strMouseTouchMoveEvent, hostOnMouseMove);
else {
_hostElement.on(_strMouseTouchEnter, hostOnMouseEnter);
_hostElement.on(_strMouseTouchLeave, hostOnMouseLeave);
}
} }
}; };
var removeLeaveEvents = function () { var removeMouseTouchEvents = function () {
if (_supportPassiveEvents) { if (_supportPassiveEvents) {
removePassiveEventListener(_hostElement, strMouseEnter, hostOnMouseEnter); removePassiveEventListener(_hostElement, _strMouseTouchMoveEvent, hostOnMouseMove);
removePassiveEventListener(_hostElement, strMouseLeave, hostOnMouseLeave); removePassiveEventListener(_hostElement, _strMouseTouchEnter, hostOnMouseEnter);
removePassiveEventListener(_hostElement, _strMouseTouchLeave, hostOnMouseLeave);
} }
else { else {
_hostElement.off(strMouseEnter, hostOnMouseEnter); _hostElement.off(_strMouseTouchMoveEvent, hostOnMouseMove);
_hostElement.off(strMouseLeave, hostOnMouseLeave); _hostElement.off(_strMouseTouchEnter, hostOnMouseEnter);
_hostElement.off(_strMouseTouchLeave, hostOnMouseLeave);
} }
}; };
if (_scrollbarsAutoHideLeave) { if (_scrollbarsAutoHideLeave || _scrollbarsAutoHideMove) {
removeLeaveEvents(); removeMouseTouchEvents();
addLeaveEvents(); addMouseTouchEvents(_scrollbarsAutoHideMove);
} }
else { else {
removeLeaveEvents(); removeMouseTouchEvents();
} }
if (_scrollbarsAutoHideNever) if (_scrollbarsAutoHideNever)
@@ -3969,12 +4000,14 @@
_sizeAutoObserverElement.remove(); _sizeAutoObserverElement.remove();
if (_supportPassiveEvents) { if (_supportPassiveEvents) {
removePassiveEventListener(_hostElement, 'mouseenter', hostOnMouseEnter); removePassiveEventListener(_hostElement, _strMouseTouchMoveEvent, hostOnMouseMove);
removePassiveEventListener(_hostElement, 'mouseleave', hostOnMouseLeave); removePassiveEventListener(_hostElement, _strMouseTouchEnter, hostOnMouseEnter);
removePassiveEventListener(_hostElement, _strMouseTouchLeave, hostOnMouseLeave);
} }
else { else {
_hostElement.off('mouseenter', hostOnMouseEnter); _hostElement.off(_strMouseTouchMoveEvent, hostOnMouseMove);
_hostElement.off('mouseleave', hostOnMouseLeave); _hostElement.off(_strMouseTouchEnter, hostOnMouseEnter);
_hostElement.off(_strMouseTouchLeave, hostOnMouseLeave);
} }
_scrollbarHorizontalElement.remove(); _scrollbarHorizontalElement.remove();
@@ -4838,5 +4871,6 @@
_pluginGlobals.defaultOptions = helper.extend(true, { }, currDefaultOptions , newDefaultOptions); _pluginGlobals.defaultOptions = helper.extend(true, { }, currDefaultOptions , newDefaultOptions);
}; };
})(COMPATIBILITY, INSTANCES, HELPER, BYPROPERTYPATH); })(COMPATIBILITY, INSTANCES, HELPER, BYPROPERTYPATH);
return window[PLUGINNAME]; return window[PLUGINNAME];
}))); })));
js/jquery.overlayScrollbars.min.js
Vendored
+3 -3
View File
File diff suppressed because one or more lines are too long
package.json
+1 -1
View File
@@ -1,6 +1,6 @@
{ {
"name": "overlayscrollbars", "name": "overlayscrollbars",
"version": "1.3.0", "version": "1.4.0",
"description": "A javascript scrollbar plugin which hides the native scrollbars and provides custom styleable overlay scrollbars, but keeps the native functionality and feeling.", "description": "A javascript scrollbar plugin which hides the native scrollbars and provides custom styleable overlay scrollbars, but keeps the native functionality and feeling.",
"keywords" : [ "keywords" : [
"overlayscrollbars", "overlayscrollbars",