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

version 1.4.5

Browse Source
This commit is contained in:
Rene
2018-05-19 00:06:14 +02:00
parent 5a828e8d82
commit cf52b12bc5
8 changed files with 722 additions and 655 deletions
Download Patch File Download Diff File Expand all files Collapse all files
README.md
+2 -1
View File
@@ -15,8 +15,9 @@ I've created this plugin because I hate ugly and space consuming scrollbars. Sim
- Usage of the most recent technologies to ensure maximum efficiency and performance on newer browsers. - Usage of the most recent technologies to ensure maximum efficiency and performance on newer browsers.
- Can be used without any dependencies or with jQuery. - Can be used without any dependencies or with jQuery.
- Automatic update detection - after the initialization you don't have to worry about updating. - Automatic update detection - after the initialization you don't have to worry about updating.
- Extremely powerful scroll method with features like animations, relative coordinates, scrollIntoView and more.
- Mouse and touch support. - Mouse and touch support.
- Textarea support. - Textarea and Body support.
- Direction RTL support. (with normalization) - Direction RTL support. (with normalization)
- Simple and effective scrollbar-styling. - Simple and effective scrollbar-styling.
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.4.4 * Version: 1.4.5
* *
* Copyright KingSora. * Copyright KingSora.
* https://github.com/KingSora * https://github.com/KingSora
* *
* Released under the MIT license. * Released under the MIT license.
* Date: 06.05.2018 * Date: 18.05.2018
*/ */
/* /*
css/OverlayScrollbars.min.css
Vendored
+2 -2
View File
File diff suppressed because one or more lines are too long
js/OverlayScrollbars.js
+520 -471
View File
File diff suppressed because it is too large Load Diff
js/OverlayScrollbars.min.js
Vendored
+3 -3
View File
File diff suppressed because one or more lines are too long
js/jquery.overlayScrollbars.js
+189 -172
View File
@@ -2,19 +2,19 @@
* OverlayScrollbars * OverlayScrollbars
* https://github.com/KingSora/OverlayScrollbars * https://github.com/KingSora/OverlayScrollbars
* *
* Version: 1.4.4 * Version: 1.4.5
* *
* Copyright KingSora. * Copyright KingSora.
* https://github.com/KingSora * https://github.com/KingSora
* *
* Released under the MIT license. * Released under the MIT license.
* Date: 06.05.2018 * Date: 18.05.2018
*/ */
(function (global, factory) { (function (global, factory) {
//if (typeof define === 'function' && define.amd) if (typeof define === 'function' && define.amd)
// define(['jquery'], function(jQuery) { return factory(global, global.document, undefined, jQuery); }); define(['jquery'], function(framework) { return factory(global, global.document, undefined, framework); });
if (typeof module === 'object' && typeof module.exports === 'object') else if (typeof module === 'object' && typeof module.exports === 'object')
module.exports = factory(global, global.document, undefined, require('jquery')); module.exports = factory(global, global.document, undefined, require('jquery'));
else else
factory(global, global.document, undefined, global.jQuery); factory(global, global.document, undefined, global.jQuery);
@@ -124,12 +124,30 @@
* @param e The event of which the default action shall be prevented. * @param e The event of which the default action shall be prevented.
*/ */
prvD: function(e) { prvD: function(e) {
if(e.preventDefault) if(e.preventDefault && e.cancelable)
e.preventDefault(); e.preventDefault();
else else
e.returnValue = false; e.returnValue = false;
}, },
/**
* Checks whether a item is in the given array and returns its index.
* @param item The item of which the position in the array shall be determined.
* @param arr The array
* @returns {number} The zero based index of the item or -1 if the item isn't in the array.
*/
inA : function(item, arr) {
for (var i = 0; i < arr.length; i++) {
//Sometiems in IE a "SCRIPT70" Permission denied error occurs if HTML elemtns in a iFrame are compared
try {
if (arr[i] === item)
return i;
}
catch(e) { }
}
return -1;
},
/** /**
* Gets the pageX and pageY values of the given mouse event. * Gets the pageX and pageY values of the given mouse event.
* @param e The mouse event of which the pageX and pageX shall be got. * @param e The mouse event of which the pageX and pageX shall be got.
@@ -208,7 +226,7 @@
var JQUERY = framework; var JQUERY = framework;
var FRAMEWORK = framework; var FRAMEWORK = framework;
var INSTANCES = (function(helper) { var INSTANCES = (function(compatibility) {
var _targets = [ ]; var _targets = [ ];
var _instancePropertyString = '__overlayScrollbars__'; var _instancePropertyString = '__overlayScrollbars__';
@@ -227,7 +245,7 @@
* @param target The target element. * @param target The target element.
*/ */
function unregisterInstanceFromTarget(target) { function unregisterInstanceFromTarget(target) {
var index = helper.inArray(target, _targets); var index = compatibility.inA(target, _targets);
if (index > -1) { if (index > -1) {
delete target[_instancePropertyString]; delete target[_instancePropertyString];
_targets.splice(index, 1); _targets.splice(index, 1);
@@ -249,10 +267,9 @@
* @returns {*} The registered instance of the target or undefined if there isn't any. * @returns {*} The registered instance of the target or undefined if there isn't any.
*/ */
function getRegisteredInstanceFromTarget(target) { function getRegisteredInstanceFromTarget(target) {
for(var i = 0; i < _targets.length; i++) var index = compatibility.inA(target, _targets);
if(target === _targets[i]) if (index > -1)
return target[_instancePropertyString]; return _targets[index][_instancePropertyString];
} }
return { return {
@@ -264,7 +281,7 @@
has : targetHasRegisteredInstance, has : targetHasRegisteredInstance,
get : getRegisteredInstanceFromTarget get : getRegisteredInstanceFromTarget
}; };
})(FRAMEWORK); })(COMPATIBILITY);
var PLUGIN = (function(compatibility, instances, helper) { var PLUGIN = (function(compatibility, instances, helper) {
var _pluginsGlobals; var _pluginsGlobals;
var _pluginsAutoUpdateLoop; var _pluginsAutoUpdateLoop;
@@ -489,7 +506,7 @@
var bodyElement = helper('body'); var bodyElement = helper('body');
var scrollbarDummyElement = helper('<div id="hs-dummy-scrollbar-size"><div style="height: 200%; width: 200%; margin: 10px 0;"></div></div>'); var scrollbarDummyElement = helper('<div id="hs-dummy-scrollbar-size"><div style="height: 200%; width: 200%; margin: 10px 0;"></div></div>');
var scrollbarDummyElement0 = scrollbarDummyElement[0]; var scrollbarDummyElement0 = scrollbarDummyElement[0];
var dummyContainerChild = helper(scrollbarDummyElement.children('div').first()); var dummyContainerChild = helper(scrollbarDummyElement.children('div').eq(0));
var IEBUGFIX = scrollbarDummyElement0[LEXICON.oH]; //IE9 causes a bug where offsetHeight is zero for no reason var IEBUGFIX = scrollbarDummyElement0[LEXICON.oH]; //IE9 causes a bug where offsetHeight is zero for no reason
bodyElement.append(scrollbarDummyElement); bodyElement.append(scrollbarDummyElement);
@@ -524,7 +541,7 @@
var trident = ua[strIndexOf]('Trident/'); var trident = ua[strIndexOf]('Trident/');
var edge = ua[strIndexOf]('Edge/'); var edge = ua[strIndexOf]('Edge/');
var rv = ua[strIndexOf]('rv:'); var rv = ua[strIndexOf]('rv:');
var result = false; var result;
var parseInt = window.parseInt; var parseInt = window.parseInt;
// IE 10 or older => return version number // IE 10 or older => return version number
@@ -837,6 +854,7 @@
var _destroyed; var _destroyed;
var _isTextarea; var _isTextarea;
var _isBody; var _isBody;
var _documentMixed;
//general: //general:
var _isBorderBox; var _isBorderBox;
@@ -887,7 +905,7 @@
var _strScrollLeft = _strScroll + 'Left'; var _strScrollLeft = _strScroll + 'Left';
var _strScrollTop = _strScroll + 'Top'; var _strScrollTop = _strScroll + 'Top';
var _strMouseTouchDownEvent = 'mousedown touchstart'; var _strMouseTouchDownEvent = 'mousedown touchstart';
var _strMouseTouchUpEvent = 'mouseup touchend'; var _strMouseTouchUpEvent = 'mouseup touchend touchcancel';
var _strMouseTouchMoveEvent = 'mousemove touchmove'; var _strMouseTouchMoveEvent = 'mousemove touchmove';
var _strMouseTouchEnter = 'mouseenter'; var _strMouseTouchEnter = 'mouseenter';
var _strMouseTouchLeave = 'mouseleave'; var _strMouseTouchLeave = 'mouseleave';
@@ -1073,7 +1091,7 @@
function addPassiveEventListener(element, eventNames, listener) { function addPassiveEventListener(element, eventNames, listener) {
var events = eventNames.split(_strSpace); var events = eventNames.split(_strSpace);
for (var i = 0; i < events.length; i++) for (var i = 0; i < events.length; i++)
element[0].addEventListener(events[i], listener, {passive: true}); element[0].addEventListener(events[i].trim(), listener, {passive: true});
} }
/** /**
@@ -1085,7 +1103,7 @@
function removePassiveEventListener(element, eventNames, listener) { function removePassiveEventListener(element, eventNames, listener) {
var events = eventNames.split(_strSpace); var events = eventNames.split(_strSpace);
for (var i = 0; i < events.length; i++) for (var i = 0; i < events.length; i++)
element[0].removeEventListener(events[i], listener); element[0].removeEventListener(events[i].trim(), listener, {passive: true});
} }
@@ -1206,7 +1224,7 @@
else { else {
var doc = _documentElement[0]; var doc = _documentElement[0];
var attachEvent = doc.attachEvent; var attachEvent = doc.attachEvent;
var isIE = _msieVersion !== false; var isIE = _msieVersion !== undefined;
if (attachEvent) { if (attachEvent) {
targetElement.prepend(generateDiv(_classNameResizeObserverElement)); targetElement.prepend(generateDiv(_classNameResizeObserverElement));
findFirst(targetElement, _strDot + _classNameResizeObserverElement)[0].attachEvent('onresize', callback); findFirst(targetElement, _strDot + _classNameResizeObserverElement)[0].attachEvent('onresize', callback);
@@ -1249,7 +1267,7 @@
css[_strRight] = 0; css[_strRight] = 0;
scrollLeftValue = _rtlScrollBehavior.n ? -constMaximum : _rtlScrollBehavior.i ? 0 : constMaximum; scrollLeftValue = _rtlScrollBehavior.n ? -constMaximum : _rtlScrollBehavior.i ? 0 : constMaximum;
} }
_sizeObserverElement.children().first().css(css); _sizeObserverElement.children().eq(0).css(css);
targetElement[_strScrollLeft](scrollLeftValue)[_strScrollTop](constMaximum); targetElement[_strScrollLeft](scrollLeftValue)[_strScrollTop](constMaximum);
_cssDirectionDetectedCache = dir; _cssDirectionDetectedCache = dir;
result = true; result = true;
@@ -1278,7 +1296,7 @@
delete element[_strResizeObserverProperty]; delete element[_strResizeObserverProperty];
} }
else { else {
remove(targetElement.children(_strDot + _classNameResizeObserverElement).first()); remove(targetElement.children(_strDot + _classNameResizeObserverElement).eq(0));
} }
} }
@@ -1294,7 +1312,7 @@
} }
/* /*
else { else {
targetElement = targetElement.children(_strDot + _classNameResizeObserverElement).first(); targetElement = targetElement.children(_strDot + _classNameResizeObserverElement).eq(0);
var w = targetElement.css(_strWidth); var w = targetElement.css(_strWidth);
var h = targetElement.css(_strHeight); var h = targetElement.css(_strHeight);
var css = {}; var css = {};
@@ -1321,7 +1339,7 @@
var css = { }; var css = { };
css[_strHeight] = _strEmpty; css[_strHeight] = _strEmpty;
css[_strWidth] = _strEmpty; css[_strWidth] = _strEmpty;
targetElement.children(_strDot + _classNameResizeObserverElement).first().css(css); targetElement.children(_strDot + _classNameResizeObserverElement).eq(0).css(css);
} }
*/ */
} }
@@ -1417,7 +1435,7 @@
refreshScrollbarsAutoHide(true); refreshScrollbarsAutoHide(true);
clearTimeout(_scrollbarsAutoHideMoveTimeoutId); clearTimeout(_scrollbarsAutoHideMoveTimeoutId);
_scrollbarsAutoHideMoveTimeoutId = setTimeout(function () { _scrollbarsAutoHideMoveTimeoutId = setTimeout(function () {
if (_scrollbarsAutoHideMove) if (_scrollbarsAutoHideMove && !_destroyed)
refreshScrollbarsAutoHide(false); refreshScrollbarsAutoHide(false);
}, 100); }, 100);
} }
@@ -1440,7 +1458,7 @@
refreshScrollbarsAutoHide(true); refreshScrollbarsAutoHide(true);
if (!nativeOverlayScrollbarsAreActive()) if (!nativeOverlayScrollbarsAreActive())
_hostElement.addClass(_classNameHostScrolling); addClass(_hostElement, _classNameHostScrolling);
callCallback(optionsCallbacks.onScrollStart, event); callCallback(optionsCallbacks.onScrollStart, event);
} }
@@ -1450,8 +1468,10 @@
callCallback(optionsCallbacks.onScroll, event); callCallback(optionsCallbacks.onScroll, event);
_scrollStopTimeoutId = setTimeout(function () { _scrollStopTimeoutId = setTimeout(function () {
viewportOnScrollStop(); if(!_destroyed) {
callCallback(optionsCallbacks.onScrollStop, event); viewportOnScrollStop();
callCallback(optionsCallbacks.onScrollStop, event);
}
}, _scrollStopDelay); }, _scrollStopDelay);
} }
@@ -1465,7 +1485,7 @@
refreshScrollbarsAutoHide(false); refreshScrollbarsAutoHide(false);
if (!nativeOverlayScrollbarsAreActive()) if (!nativeOverlayScrollbarsAreActive())
_hostElement.removeClass(_classNameHostScrolling); removeClass(_hostElement, _classNameHostScrolling);
} }
/** /**
@@ -1519,8 +1539,10 @@
*/ */
function textareaOnDrop() { function textareaOnDrop() {
setTimeout(function () { setTimeout(function () {
textareaUpdate(); if(!_destroyed) {
_base.update(_strAuto); textareaUpdate();
_base.update(_strAuto);
}
}, 50); }, 50);
} }
@@ -1580,7 +1602,7 @@
.on(_strMouseTouchMoveEvent, scrollbarCornerOnResize) .on(_strMouseTouchMoveEvent, scrollbarCornerOnResize)
.on(_strMouseTouchUpEvent, scrollbarCornerOnResized); .on(_strMouseTouchUpEvent, scrollbarCornerOnResized);
_bodyElement.addClass(_classNameDragging); addClass(_bodyElement, _classNameDragging);
if (_scrollbarCornerElement.setCapture) if (_scrollbarCornerElement.setCapture)
_scrollbarCornerElement.setCapture(); _scrollbarCornerElement.setCapture();
@@ -1615,7 +1637,7 @@
.off(_strMouseTouchMoveEvent, scrollbarCornerOnResize) .off(_strMouseTouchMoveEvent, scrollbarCornerOnResize)
.off(_strMouseTouchUpEvent, scrollbarCornerOnResized); .off(_strMouseTouchUpEvent, scrollbarCornerOnResized);
_bodyElement.removeClass(_classNameDragging); removeClass(_bodyElement, _classNameDragging);
if (_scrollbarCornerElement.releaseCapture) if (_scrollbarCornerElement.releaseCapture)
_scrollbarCornerElement.releaseCapture(); _scrollbarCornerElement.releaseCapture();
@@ -1958,10 +1980,11 @@
} }
//abort update due to: //abort update due to:
//destroyed
//swallowing //swallowing
//sleeping //sleeping
//host is hidden or has false display //host is hidden or has false display
if (swallow || _isSleeping || (_initialized && !force && _hostElement.is(':hidden')) || _hostElement.css('display') === 'inline') if (_destroyed || swallow || _isSleeping || (_initialized && !force && _hostElement.is(':hidden')) || _hostElement.css('display') === 'inline')
return; return;
_lastUpdateTime = now; _lastUpdateTime = now;
@@ -2952,15 +2975,15 @@
//handle scroll //handle scroll
if (_isTextarea && contentSizeChanged) { if (_isTextarea && contentSizeChanged) {
var textareaInfo = getTextareaInfo(); var textareaInfo = getTextareaInfo();
if (textareaInfo !== undefined) { if (textareaInfo) {
var textareaRowsChanged = _textareaInfoCache === undefined ? true : textareaInfo.rows !== _textareaInfoCache.rows; var textareaRowsChanged = _textareaInfoCache === undefined ? true : textareaInfo.rows !== _textareaInfoCache.rows;
var widestRow = textareaInfo.wRow; var cursorRow = textareaInfo.cR;
var cursorRow = textareaInfo.cursorRow; var cursorCol = textareaInfo.cC;
var cursorCol = textareaInfo.cursorCol; var widestRow = textareaInfo.w;
var lastRow = textareaInfo.rows; var lastRow = textareaInfo.r;
var lastCol = textareaInfo.cols; var lastCol = textareaInfo.c;
var cursorPos = textareaInfo.pos; var cursorPos = textareaInfo.p;
var cursorMax = textareaInfo.max; var cursorMax = textareaInfo.m;
var cursorIsLastPosition = (cursorMax === cursorPos && _textareaHasFocus); var cursorIsLastPosition = (cursorMax === cursorPos && _textareaHasFocus);
var doScroll = { var doScroll = {
x: (!textareaAutoWrapping && (cursorCol === lastCol && cursorRow === widestRow)) ? _overflowAmountCache.x : -1, x: (!textareaAutoWrapping && (cursorCol === lastCol && cursorRow === widestRow)) ? _overflowAmountCache.x : -1,
@@ -3139,19 +3162,11 @@
removeClass(scrollbarVars.t, strActive); removeClass(scrollbarVars.t, strActive);
removeClass(scrollbarVars.s, strActive); removeClass(scrollbarVars.s, strActive);
if (_supportPassiveEvents) { _documentElement.off(_strMouseTouchMoveEvent, handleDragMove)
removePassiveEventListener(_documentElement, _strMouseTouchMoveEvent, handleDragMove); .off(_strMouseTouchUpEvent, documentMouseTouchUp)
removePassiveEventListener(_documentElement, _strMouseTouchUpEvent, documentMouseTouchUp); .off(_strKeyDownEvent, documentKeyDown)
removePassiveEventListener(_documentElement, _strKeyDownEvent, documentKeyDown); .off(_strKeyUpEvent, documentKeyUp)
removePassiveEventListener(_documentElement, _strKeyUpEvent, documentKeyUp); .off(_strSelectStartEvent, documentOnSelectStart);
}
else {
_documentElement.off(_strMouseTouchMoveEvent, handleDragMove)
.off(_strMouseTouchUpEvent, documentMouseTouchUp)
.off(_strKeyDownEvent, documentKeyDown)
.off(_strKeyUpEvent, documentKeyUp);
}
_documentElement.off(_strSelectStartEvent, documentOnSelectStart);
decreaseTrackScrollAmount(); decreaseTrackScrollAmount();
mouseDownScroll = undefined; mouseDownScroll = undefined;
@@ -3195,21 +3210,17 @@
mouseDownScroll = mouseDownScroll < 0 ? 0 : mouseDownScroll; mouseDownScroll = mouseDownScroll < 0 ? 0 : mouseDownScroll;
mouseDownOffset = compatibility.page(event)[xy]; mouseDownOffset = compatibility.page(event)[xy];
addClass(_bodyElement, _classNameDragging); addClass(_bodyElement, _classNameDragging);
addClass(scrollbarVars.h, strActive); addClass(scrollbarVars.h, strActive);
addClass(scrollbarVars.s, strActive); addClass(scrollbarVars.s, strActive);
if (_supportPassiveEvents) { _documentElement.on(_strMouseTouchMoveEvent, handleDragMove)
addPassiveEventListener(_documentElement, _strMouseTouchMoveEvent, handleDragMove); .on(_strMouseTouchUpEvent, documentMouseTouchUp)
addPassiveEventListener(_documentElement, _strMouseTouchUpEvent, documentMouseTouchUp); .on(_strSelectStartEvent, documentOnSelectStart);
}
else { if(_msieVersion || !_documentMixed)
_documentElement.on(_strMouseTouchMoveEvent, handleDragMove) compatibility.prvD(event);
.on(_strMouseTouchUpEvent, documentMouseTouchUp); compatibility.stpP(event);
}
_documentElement.on(_strSelectStartEvent, documentOnSelectStart);
compatibility.prvD(event);
} }
}); });
scrollbarVars.t.on(_strMouseTouchDownEvent, function (event) { scrollbarVars.t.on(_strMouseTouchDownEvent, function (event) {
@@ -3229,43 +3240,45 @@
if (event.shiftKey) if (event.shiftKey)
increaseTrackScrollAmount(); increaseTrackScrollAmount();
var scrollAction = function () { var scrollAction = function () {
var handleOffset = scrollbarVars.i.ho; if(!_destroyed) {
var handleLength = scrollbarVars.i.hl; var handleOffset = scrollbarVars.i.ho;
var mouseOffset = mouseDownOffset - trackOffset; var handleLength = scrollbarVars.i.hl;
var scrollDuration = 200 * scrollDurationFactor; var mouseOffset = mouseDownOffset - trackOffset;
var timeoutDelay = isFirstIteration ? Math.max(333, scrollDuration) : scrollDuration; var scrollDuration = 200 * scrollDurationFactor;
var scrollObj = {}; var timeoutDelay = isFirstIteration ? Math.max(333, scrollDuration) : scrollDuration;
var rtlIsNormal = _isRTL && isHorizontal && ((!_rtlScrollBehavior.i && !_rtlScrollBehavior.n) || _normalizeRTLCache); var scrollObj = {};
var decreaseScrollCondition = handleOffset > mouseOffset; var rtlIsNormal = _isRTL && isHorizontal && ((!_rtlScrollBehavior.i && !_rtlScrollBehavior.n) || _normalizeRTLCache);
var decreaseScrollCondition = handleOffset > mouseOffset;
if (rtlIsNormal) if (rtlIsNormal)
decreaseScrollCondition = handleOffset < mouseOffset; decreaseScrollCondition = handleOffset < mouseOffset;
if (decreaseScrollCondition) { if (decreaseScrollCondition) {
if (decreaseScroll === undefined) if (decreaseScroll === undefined)
decreaseScroll = true; decreaseScroll = true;
scrollObj[scrollbarVars.xy] = '-=' + scrollDistance; scrollObj[scrollbarVars.xy] = '-=' + scrollDistance;
} }
else { else {
if (decreaseScroll === undefined) if (decreaseScroll === undefined)
decreaseScroll = false; decreaseScroll = false;
scrollObj[scrollbarVars.xy] = '+=' + scrollDistance; scrollObj[scrollbarVars.xy] = '+=' + scrollDistance;
} }
_base.scrollStop();
_base.scroll(scrollObj, scrollDuration, 'linear');
var finishedCondition = decreaseScroll ? handleOffset <= mouseOffset : handleOffset + handleLength >= mouseOffset;
if (rtlIsNormal)
finishedCondition = decreaseScroll ? handleOffset + handleLength >= mouseOffset : handleOffset <= mouseOffset;
if (finishedCondition) {
clearTimeout(trackTimeout);
_base.scrollStop(); _base.scrollStop();
trackTimeout = undefined; _base.scroll(scrollObj, scrollDuration, 'linear');
var finishedCondition = decreaseScroll ? handleOffset <= mouseOffset : handleOffset + handleLength >= mouseOffset;
if (rtlIsNormal)
finishedCondition = decreaseScroll ? handleOffset + handleLength >= mouseOffset : handleOffset <= mouseOffset;
if (finishedCondition) {
clearTimeout(trackTimeout);
_base.scrollStop();
trackTimeout = undefined;
}
else
trackTimeout = setTimeout(scrollAction, timeoutDelay);
isFirstIteration = false;
} }
else
trackTimeout = setTimeout(scrollAction, timeoutDelay);
isFirstIteration = false;
}; };
mouseDownOffset = compatibility.page(event)[xy]; mouseDownOffset = compatibility.page(event)[xy];
@@ -3274,20 +3287,14 @@
addClass(scrollbarVars.t, strActive); addClass(scrollbarVars.t, strActive);
addClass(scrollbarVars.s, strActive); addClass(scrollbarVars.s, strActive);
if (_supportPassiveEvents) { _documentElement.on(_strMouseTouchUpEvent, documentMouseTouchUp)
addPassiveEventListener(_documentElement, _strMouseTouchUpEvent, documentMouseTouchUp); .on(_strKeyDownEvent, documentKeyDown)
addPassiveEventListener(_documentElement, _strKeyDownEvent, documentKeyDown); .on(_strKeyUpEvent, documentKeyUp)
addPassiveEventListener(_documentElement, _strKeyUpEvent, documentKeyUp); .on(_strSelectStartEvent, documentOnSelectStart);
}
else {
_documentElement.on(_strMouseTouchUpEvent, documentMouseTouchUp)
.on(_strKeyDownEvent, documentKeyDown)
.on(_strKeyUpEvent, documentKeyUp);
}
_documentElement.on(_strSelectStartEvent, documentOnSelectStart);
scrollAction(); scrollAction();
compatibility.prvD(event); compatibility.prvD(event);
compatibility.stpP(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 || _scrollbarsAutoHideMove) { if (_scrollbarsAutoHideScroll || _scrollbarsAutoHideMove) {
@@ -3316,14 +3323,14 @@
var scrollbarElement = isHorizontal ? _scrollbarHorizontalElement : _scrollbarVerticalElement; var scrollbarElement = isHorizontal ? _scrollbarHorizontalElement : _scrollbarVerticalElement;
if (shallBeVisible) if (shallBeVisible)
_hostElement.removeClass(scrollbarClassName); removeClass(_hostElement, scrollbarClassName);
else else
_hostElement.addClass(scrollbarClassName); addClass(_hostElement, scrollbarClassName);
if (canScroll) if (canScroll)
scrollbarElement.removeClass(_classNameScrollbarUnusable); removeClass(scrollbarElement, _classNameScrollbarUnusable);
else else
scrollbarElement.addClass(_classNameScrollbarUnusable); addClass(scrollbarElement, _classNameScrollbarUnusable);
} }
/** /**
@@ -3335,19 +3342,19 @@
clearTimeout(_scrollbarsAutoHideTimeoutId); clearTimeout(_scrollbarsAutoHideTimeoutId);
if (shallBeVisible) { if (shallBeVisible) {
//if(_hasOverflowCache.x && _hideOverflowCache.xs) //if(_hasOverflowCache.x && _hideOverflowCache.xs)
_scrollbarHorizontalElement.removeClass(_classNameScrollbarAutoHidden); removeClass(_scrollbarHorizontalElement, _classNameScrollbarAutoHidden);
//if(_hasOverflowCache.y && _hideOverflowCache.ys) //if(_hasOverflowCache.y && _hideOverflowCache.ys)
_scrollbarVerticalElement.removeClass(_classNameScrollbarAutoHidden); removeClass(_scrollbarVerticalElement, _classNameScrollbarAutoHidden);
} }
else { else {
var strActive = 'active'; var strActive = 'active';
var hide = function () { var hide = function () {
if (!_scrollbarsAutoHideFlagScrollAndHovered) { if (!_scrollbarsAutoHideFlagScrollAndHovered && !_destroyed) {
var anyActive = _scrollbarHorizontalHandleElement.hasClass(strActive) || _scrollbarVerticalHandleElement.hasClass(strActive); var anyActive = _scrollbarHorizontalHandleElement.hasClass(strActive) || _scrollbarVerticalHandleElement.hasClass(strActive);
if (!anyActive && (_scrollbarsAutoHideScroll || _scrollbarsAutoHideMove || _scrollbarsAutoHideLeave)) if (!anyActive && (_scrollbarsAutoHideScroll || _scrollbarsAutoHideMove || _scrollbarsAutoHideLeave))
_scrollbarHorizontalElement.addClass(_classNameScrollbarAutoHidden); addClass(_scrollbarHorizontalElement, _classNameScrollbarAutoHidden);
if (!anyActive && (_scrollbarsAutoHideScroll || _scrollbarsAutoHideMove || _scrollbarsAutoHideLeave)) if (!anyActive && (_scrollbarsAutoHideScroll || _scrollbarsAutoHideMove || _scrollbarsAutoHideLeave))
_scrollbarVerticalElement.addClass(_classNameScrollbarAutoHidden); addClass(_scrollbarVerticalElement, _classNameScrollbarAutoHidden);
} }
}; };
if (_scrollbarsAutoHideDelay > 0 && delayfree !== true) if (_scrollbarsAutoHideDelay > 0 && delayfree !== true)
@@ -3364,10 +3371,10 @@
function refreshScrollbarHandleLength(isHorizontal) { function refreshScrollbarHandleLength(isHorizontal) {
var handleCSS = {}; var handleCSS = {};
var scrollbarVars = getScrollbarVars(isHorizontal); var scrollbarVars = getScrollbarVars(isHorizontal);
var digit = 1000000;
//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]);
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 * digit) / digit) + "%"; //the last * digit / digit is for flooring to the 4th digit
if (!nativeOverlayScrollbarsAreActive()) if (!nativeOverlayScrollbarsAreActive())
scrollbarVars.h.css(handleCSS); scrollbarVars.h.css(handleCSS);
@@ -3421,7 +3428,8 @@
if (_supportTransform) { if (_supportTransform) {
if (isRTLisHorizontal) if (isRTLisHorizontal)
offset = -(trackLength - handleLength - offset); offset = -(trackLength - handleLength - offset);
translateValue = isHorizontal ? strTranslateBrace + offset + 'px, 0px)' : strTranslateBrace + '0px, ' + offset + 'px)'; //offset = (offset / trackLength * 100) * (trackLength / handleLength); in %
translateValue = isHorizontal ? strTranslateBrace + offset + 'px, 0)' : strTranslateBrace + '0, ' + offset + 'px)';
handleCSS['-webkit-' + strTransform] = translateValue; handleCSS['-webkit-' + strTransform] = translateValue;
handleCSS['-moz-' + strTransform] = translateValue; handleCSS['-moz-' + strTransform] = translateValue;
handleCSS['-ms-' + strTransform] = translateValue; handleCSS['-ms-' + strTransform] = translateValue;
@@ -3512,8 +3520,11 @@
* @returns {boolean} True the given object is a HTMLElement, false otherwise. * @returns {boolean} True the given object is a HTMLElement, false otherwise.
*/ */
function isHTMLElement(o) { function isHTMLElement(o) {
var strOwnerDocument = 'ownerDocument';
var strHTMLElement = 'HTMLElement';
var wnd = o && o[strOwnerDocument] ? (o[strOwnerDocument].parentWindow || window) : window;
return ( return (
typeof window.HTMLElement === TYPES.o ? o instanceof window.HTMLElement : //DOM2 typeof wnd[strHTMLElement] === TYPES.o ? o instanceof wnd[strHTMLElement] : //DOM2
o && typeof o === TYPES.o && o !== null && o.nodeType === 1 && typeof o.nodeName === TYPES.s o && typeof o === TYPES.o && o !== null && o.nodeType === 1 && typeof o.nodeName === TYPES.s
); );
} }
@@ -3525,22 +3536,20 @@
* @returns {Array} The differences between the two arrays. * @returns {Array} The differences between the two arrays.
*/ */
function getArrayDifferences(a1, a2) { function getArrayDifferences(a1, a2) {
var a = []; var a = [ ];
var diff = []; var diff = [ ];
var i; var i;
for (i = 0; i < a1.length; i++) { var k;
for (i = 0; i < a1.length; i++)
a[a1[i]] = true; a[a1[i]] = true;
}
for (i = 0; i < a2.length; i++) { for (i = 0; i < a2.length; i++) {
if (a[a2[i]]) { if (a[a2[i]])
delete a[a2[i]]; delete a[a2[i]];
} else { else
a[a2[i]] = true; a[a2[i]] = true;
}
} }
for (var k in a) { for (k in a)
diff.push(k); diff.push(k);
}
return diff; return diff;
} }
@@ -3559,24 +3568,26 @@
*/ */
function getTextareaInfo() { function getTextareaInfo() {
//read needed values //read needed values
var textareaCursorPosition = _targetElement.prop('selectionStart'); var textareaCursorPosition = _targetElement[0].selectionStart;
if (textareaCursorPosition === undefined) if (textareaCursorPosition === undefined)
return; return;
var strLength = 'length';
var textareaValue = _targetElement.val(); var textareaValue = _targetElement.val();
var textareaLength = textareaValue.length; var textareaLength = textareaValue[strLength];
var textareaRowSplit = textareaValue.split("\n"); var textareaRowSplit = textareaValue.split("\n");
var textareaLastRow = textareaRowSplit.length; var textareaLastRow = textareaRowSplit[strLength];
var textareaCurrentCursorRowSplit = textareaValue.substr(0, textareaCursorPosition).split("\n"); var textareaCurrentCursorRowSplit = textareaValue.substr(0, textareaCursorPosition).split("\n");
var widestRow = 0; var widestRow = 0;
var textareaLastCol = 0; var textareaLastCol = 0;
var cursorRow = textareaCurrentCursorRowSplit.length; var cursorRow = textareaCurrentCursorRowSplit[strLength];
var cursorCol = textareaCurrentCursorRowSplit[textareaCurrentCursorRowSplit.length - 1].length; var cursorCol = textareaCurrentCursorRowSplit[textareaCurrentCursorRowSplit[strLength] - 1][strLength];
var rowCols; var rowCols;
var i; var i;
//get widest Row and the last column of the textarea //get widest Row and the last column of the textarea
for (i = 0; i < textareaRowSplit.length; i++) { for (i = 0; i < textareaRowSplit[strLength]; i++) {
rowCols = textareaRowSplit[i].length; rowCols = textareaRowSplit[i][strLength];
if (rowCols > textareaLastCol) { if (rowCols > textareaLastCol) {
widestRow = i + 1; widestRow = i + 1;
textareaLastCol = rowCols; textareaLastCol = rowCols;
@@ -3584,13 +3595,13 @@
} }
return { return {
cursorRow: cursorRow, cR: cursorRow, //cursorRow
cursorCol: cursorCol, cC: cursorCol, //cursorCol
rows: textareaLastRow, r: textareaLastRow, //rows
cols: textareaLastCol, c: textareaLastCol, //cols
wRow: widestRow, w: widestRow, //wRow
pos: textareaCursorPosition, p: textareaCursorPosition, //pos
max: textareaLength m: textareaLength //max
}; };
} }
@@ -3630,7 +3641,7 @@
* @returns {*} The first element which is a child of the given element and matches the givens selector. * @returns {*} The first element which is a child of the given element and matches the givens selector.
*/ */
function findFirst(el, selector) { function findFirst(el, selector) {
return helper.prototype.find.call(el, selector).first(); return helper.prototype.find.call(el, selector).eq(0);
} }
/** /**
@@ -3835,7 +3846,7 @@
} }
if(!_isTextarea && !isZoom) { if(!_isTextarea && !isZoom) {
_contentElement.find(imgElementSelector).each(function(i, el) { _contentElement.find(imgElementSelector).each(function(i, el) {
var index = helper.inArray(el, _imgs); var index = compatibility.inA(el, _imgs);
if (index === -1) { if (index === -1) {
el = helper(el); el = helper(el);
el.off(imgElementLoadEvent, imgOnLoad).on(imgElementLoadEvent, imgOnLoad); el.off(imgElementLoadEvent, imgOnLoad).on(imgElementLoadEvent, imgOnLoad);
@@ -4001,11 +4012,11 @@
* *
* 3. Can be a object with a HTML or jQuery element with additional settings: * 3. Can be a object with a HTML or jQuery element with additional settings:
* { * {
* el : [HTMLElement, jQuery element], MUST be defined, else this object isn't valid. * el : [HTMLElement, jQuery element], MUST be defined, else this object isn't valid.
* axis : [string], Default value is 'xy'. * axis : [string], Default value is 'xy'.
* block : [string], Default value is 'begin'. * block : [string], Default value is 'begin'.
* margin : [number, array, boolean] Default value is false. * margin : [number, array, boolean] Default value is false.
* } * }
* *
* Possible axis settings are: * Possible axis settings are:
* 'x' Scrolls only the x axis. * 'x' Scrolls only the x axis.
@@ -4017,7 +4028,7 @@
* 'begin' Both axis shall be docked to the "begin" edge. - The element will be docked to the top and left edge of the viewport. * 'begin' Both axis shall be docked to the "begin" edge. - The element will be docked to the top and left edge of the viewport.
* 'end' Both axis shall be docked to the "end" edge. - The element will be docked to the bottom and right edge of the viewport. (If direction is RTL to the bottom and left edge.) * 'end' Both axis shall be docked to the "end" edge. - The element will be docked to the bottom and right edge of the viewport. (If direction is RTL to the bottom and left edge.)
* 'center' Both axis shall be docked to "center". - The element will be centered in the viewport. * 'center' Both axis shall be docked to "center". - The element will be centered in the viewport.
* 'nearest' The element will be docked to the nearest edges. * 'nearest' The element will be docked to the nearest edges, but only if it isn't in view.
* [ string, string ] Specify Begin or End for each axis individually. * [ string, string ] Specify Begin or End for each axis individually.
* *
* Possible margin settings are: -- The actual margin of the element wont be affect, this option affects only the final scroll offset. * Possible margin settings are: -- The actual margin of the element wont be affect, this option affects only the final scroll offset.
@@ -4360,18 +4371,21 @@
}; };
var finalizeBlock = function(isX) { var finalizeBlock = function(isX) {
var scrollbarVars = getScrollbarVars(isX); var scrollbarVars = getScrollbarVars(isX);
var divide = blockIsCenter[scrollbarVars.xy] ? 2 : 1; var wh = scrollbarVars._wh;
var elementCenterOffset = elementOffset[scrollbarVars.lt] + (elementSize[scrollbarVars._wh] / 2); var lt = scrollbarVars.lt;
var viewportCenterOffset = viewportOffset[scrollbarVars.lt] + (_viewportSize[scrollbarVars._wh] / 2); var xy = scrollbarVars.xy;
var divide = blockIsCenter[xy] ? 2 : 1;
var elementCenterOffset = elementOffset[lt] + (elementSize[wh] / 2);
var viewportCenterOffset = viewportOffset[lt] + (_viewportSize[wh] / 2);
if(blockIsNearest[scrollbarVars.xy]) { if(blockIsNearest[xy]) {
//if element is completely in view don't scroll on this axis //if element is completely in view don't scroll on this axis
doNothing[scrollbarVars.xy] = elementSize[scrollbarVars._wh] <= _viewportSize[scrollbarVars._wh] && elementOffset[scrollbarVars.lt] >= viewportOffset[scrollbarVars.lt] && elementOffset[scrollbarVars.lt] + elementSize[scrollbarVars._wh] <= viewportOffset[scrollbarVars.lt] + _viewportSize[scrollbarVars._wh]; doNothing[xy] = elementSize[wh] <= _viewportSize[wh] && elementOffset[lt] >= viewportOffset[lt] && elementOffset[lt] + elementSize[wh] <= viewportOffset[lt] + _viewportSize[wh];
blockIsEnd[scrollbarVars.xy] = elementSize[scrollbarVars._wh] < _viewportSize[scrollbarVars._wh] ? elementCenterOffset > viewportCenterOffset : elementCenterOffset < viewportCenterOffset; blockIsEnd[xy] = elementSize[wh] < _viewportSize[wh] ? elementCenterOffset > viewportCenterOffset : elementCenterOffset < viewportCenterOffset;
} }
if (blockIsEnd[scrollbarVars.xy] || blockIsCenter[scrollbarVars.xy]) if (blockIsEnd[xy] || blockIsCenter[xy])
elementScrollCoordinates[scrollbarVars.xy] -= ((_viewportSize[scrollbarVars._wh] / divide) - (elementSize[scrollbarVars._wh] / divide)) * (isX && _isRTL && _normalizeRTLCache ? -1 : 1); elementScrollCoordinates[xy] -= ((_viewportSize[wh] / divide) - (elementSize[wh] / divide)) * (isX && _isRTL && _normalizeRTLCache ? -1 : 1);
}; };
finalizeBlock(true); finalizeBlock(true);
finalizeBlock(false); finalizeBlock(false);
@@ -4489,7 +4503,8 @@
hasOverflow: prepare(_hasOverflowCache), hasOverflow: prepare(_hasOverflowCache),
contentScrollSize: prepare(_contentScrollSizeCache), contentScrollSize: prepare(_contentScrollSizeCache),
viewportSize: prepare(_viewportSize), viewportSize: prepare(_viewportSize),
hostSize: prepare(_hostSizeCache) hostSize: prepare(_hostSizeCache),
documentMixed : prepare(_documentMixed)
}; };
if (type(stateProperty) === TYPES.s) if (type(stateProperty) === TYPES.s)
return getObjectPropVal(obj, stateProperty); return getObjectPropVal(obj, stateProperty);
@@ -4537,6 +4552,7 @@
_targetElement = helper(targetElement); _targetElement = helper(targetElement);
_isTextarea = _targetElement.is('textarea'); _isTextarea = _targetElement.is('textarea');
_isBody = _targetElement.is('body'); _isBody = _targetElement.is('body');
_documentMixed = _documentElement[0] !== document;
var initBodyScroll; var initBodyScroll;
if (_isBody) { if (_isBody) {
@@ -4659,16 +4675,18 @@
now = compatibility.now(); now = compatibility.now();
sizeAuto = (_heightAutoCache || _widthAutoCache); sizeAuto = (_heightAutoCache || _widthAutoCache);
action = function () { action = function () {
contentLastUpdate = now; if(!_destroyed) {
contentLastUpdate = now;
//if cols, rows or wrap attr was changed //if cols, rows or wrap attr was changed
if (_isTextarea) if (_isTextarea)
textareaUpdate(); textareaUpdate();
if (sizeAuto) if (sizeAuto)
_base.update(); _base.update();
else else
_base.update(_strAuto); _base.update(_strAuto);
}
}; };
clearTimeout(contentTimeout); clearTimeout(contentTimeout);
if (_mutationObserverContentLag <= 0 || now - contentLastUpdate > _mutationObserverContentLag || !sizeAuto) if (_mutationObserverContentLag <= 0 || now - contentLastUpdate > _mutationObserverContentLag || !sizeAuto)
@@ -4681,7 +4699,7 @@
//build resize observer for the host element //build resize observer for the host element
if (_isBody) { if (_isBody) {
addClass(_htmlElement, _classNameHTMLElement) addClass(_htmlElement, _classNameHTMLElement);
//apply the body scroll to handle it right in the update method //apply the body scroll to handle it right in the update method
_viewportElement[_strScrollLeft](initBodyScroll.l); _viewportElement[_strScrollLeft](initBodyScroll.l);
@@ -4733,7 +4751,6 @@
if (pluginTargetElements && pluginTargetElements.length) { if (pluginTargetElements && pluginTargetElements.length) {
helper.each(pluginTargetElements, function () { helper.each(pluginTargetElements, function () {
inst = this; inst = this;
console.log(inst);
if(inst !== undefined) if(inst !== undefined)
arr.push(OverlayScrollbarsInstance(inst, options, _pluginsGlobals, _pluginsAutoUpdateLoop)); arr.push(OverlayScrollbarsInstance(inst, options, _pluginsGlobals, _pluginsAutoUpdateLoop));
}); });
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.4.4", "version": "1.4.5",
"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",