diff --git a/simple-scrollbar.css b/simple-scrollbar.css index e467520..8f47d77 100644 --- a/simple-scrollbar.css +++ b/simple-scrollbar.css @@ -1,20 +1,20 @@ .ss-wrapper { - overflow : hidden; - height : 100%; - position : relative; - z-index : 1; - float: left; + overflow : hidden; + height : 100%; + position : relative; + z-index : 1; + float: left; } .ss-content { - height : 100%; - width : 100%; - padding : 0 32px 0 0; - position : relative; - right : -18px; - overflow : auto; - -moz-box-sizing : border-box; - box-sizing : border-box; + height : 100%; + width : 100%; + padding : 0 32px 0 0; + position : relative; + right : -18px; + overflow : auto; + -moz-box-sizing : border-box; + box-sizing : border-box; } .ss-scroll { @@ -29,14 +29,18 @@ transition: opacity 0.25s linear; } +.ss-hidden { + display: none; +} + .ss-container:hover .ss-scroll { opacity: 1; } .ss-grabbed { - user-select: none; - -o-user-select: none; - -moz-user-select: none; - -khtml-user-select: none; - -webkit-user-select: none; + user-select: none; + -o-user-select: none; + -moz-user-select: none; + -khtml-user-select: none; + -webkit-user-select: none; } diff --git a/simple-scrollbar.js b/simple-scrollbar.js index 66452cc..9f04b8f 100644 --- a/simple-scrollbar.js +++ b/simple-scrollbar.js @@ -77,11 +77,17 @@ this.scrollRatio = ownHeight / totalHeight; raf(function() { - _this.bar.style.cssText = 'height:' + (ownHeight / totalHeight) * 100 + '%; top:' + (_this.el.scrollTop / totalHeight ) * 100 + '%;right:-' + (_this.target.clientWidth - _this.bar.clientWidth) + 'px;'; + // Hide scrollbar if no scrolling is possible + if(_this.scrollRatio === 1) { + _this.bar.classList.add('ss-hidden') + } else { + _this.bar.classList.remove('ss-hidden') + _this.bar.style.cssText = 'height:' + (_this.scrollRatio) * 100 + '%; top:' + (_this.el.scrollTop / totalHeight ) * 100 + '%;right:-' + (_this.target.clientWidth - _this.bar.clientWidth) + 'px;'; + } }); } } - + function initAll() { var nodes = d.querySelectorAll('*[ss-container]'); @@ -89,7 +95,7 @@ initEl(nodes[i]); } } - + d.addEventListener('DOMContentLoaded', initAll); ss.initEl = initEl; ss.initAll = initAll; diff --git a/simple-scrollbar.min.js b/simple-scrollbar.min.js index 9da7cbe..96230a3 100644 --- a/simple-scrollbar.min.js +++ b/simple-scrollbar.min.js @@ -1 +1 @@ -(function(n,t){function u(n){n.hasOwnProperty("data-simple-scrollbar")||Object.defineProperty(n,"data-simple-scrollbar",new SimpleScrollbar(n))}function e(n,i){function f(n){var t=n.pageY-u;u=n.pageY;r(function(){i.el.scrollTop+=t/i.scrollRatio})}function e(){n.classList.remove("ss-grabbed");t.body.classList.remove("ss-grabbed");t.removeEventListener("mousemove",f);t.removeEventListener("mouseup",e)}var u;n.addEventListener("mousedown",function(i){return u=i.pageY,n.classList.add("ss-grabbed"),t.body.classList.add("ss-grabbed"),t.addEventListener("mousemove",f),t.addEventListener("mouseup",e),!1})}function i(n){for(this.target=n,this.bar='