diff --git a/simple-scrollbar.css b/simple-scrollbar.css
index 97c8774..8b4cca4 100644
--- a/simple-scrollbar.css
+++ b/simple-scrollbar.css
@@ -34,7 +34,8 @@
}
.ss-hidden {
- display: none;
+ top: -99999px !important;
+ left: -99999px !important;
}
.ss-container:hover .ss-scroll,
diff --git a/simple-scrollbar.js b/simple-scrollbar.js
index 71b1337..3ca75b8 100644
--- a/simple-scrollbar.js
+++ b/simple-scrollbar.js
@@ -82,9 +82,18 @@
this.target.classList.add('ss-container');
var css = w.getComputedStyle(el);
- if (css['height'] === '0px' && css['max-height'] !== '0px') {
- el.style.height = css['max-height'];
+ if (css['height'] === '0px' && css['max-height'] !== '0px') {
+ el.style.height = css['max-height'];
}
+
+ this.observer = new MutationObserver(function(list) {
+ if(list.length) this.moveBar();
+ }.bind(this));
+
+ this.observer.observe(this.el, {
+ childList: true,
+ subtree: true,
+ });
}
ss.prototype = {
diff --git a/simple-scrollbar.min.js b/simple-scrollbar.min.js
index 736c6d0..1bd75d8 100644
--- a/simple-scrollbar.min.js
+++ b/simple-scrollbar.min.js
@@ -1 +1 @@
-!function(t,e){"object"==typeof exports?module.exports=e(window,document):t.SimpleScrollbar=e(window,document)}(this,function(t,e){function s(t){Object.prototype.hasOwnProperty.call(t,"data-simple-scrollbar")||Object.defineProperty(t,"data-simple-scrollbar",{value:new o(t)})}function i(t,s){function i(t){var e=t.pageY-a;a=t.pageY,n(function(){s.el.scrollTop+=e/s.scrollRatio})}function r(){t.classList.remove("ss-grabbed"),e.body.classList.remove("ss-grabbed"),e.removeEventListener("mousemove",i),e.removeEventListener("mouseup",r)}var a;t.addEventListener("mousedown",function(s){return a=s.pageY,t.classList.add("ss-grabbed"),e.body.classList.add("ss-grabbed"),e.addEventListener("mousemove",i),e.addEventListener("mouseup",r),!1})}function r(t){for(this.target=t,this.direction=window.getComputedStyle(this.target).direction,this.bar='
',this.wrapper=e.createElement("div"),this.wrapper.setAttribute("class","ss-wrapper"),this.el=e.createElement("div"),this.el.setAttribute("class","ss-content"),"rtl"===this.direction&&this.el.classList.add("rtl"),this.wrapper.appendChild(this.el);this.target.firstChild;)this.el.appendChild(this.target.firstChild);this.target.appendChild(this.wrapper),this.target.insertAdjacentHTML("beforeend",this.bar),this.bar=this.target.lastChild,i(this.bar,this),this.moveBar(),this.el.addEventListener("scroll",this.moveBar.bind(this)),this.el.addEventListener("mouseenter",this.moveBar.bind(this)),this.target.classList.add("ss-container");var s=window.getComputedStyle(t);"0px"===s.height&&"0px"!==s["max-height"]&&(t.style.height=s["max-height"])}function a(){for(var t=e.querySelectorAll("*[ss-container]"),i=0;i
=1?i.bar.classList.add("ss-hidden"):(i.bar.classList.remove("ss-hidden"),i.bar.style.cssText="height:"+Math.max(100*i.scrollRatio,10)+"%; top:"+i.el.scrollTop/e*100+"%;right:"+a+"px;")})}},e.addEventListener("DOMContentLoaded",a),r.initEl=s,r.initAll=a;var o=r;return o});
+!function(t,e){"object"==typeof exports?module.exports=e(window,document):t.SimpleScrollbar=e(window,document)}(this,function(t,e){var s=t.requestAnimationFrame||t.setImmediate||function(t){return setTimeout(t,0)};function i(t){Object.prototype.hasOwnProperty.call(t,"data-simple-scrollbar")||Object.defineProperty(t,"data-simple-scrollbar",{value:new n(t)})}function r(i){for(this.target=i,this.direction=t.getComputedStyle(this.target).direction,this.bar='',this.wrapper=e.createElement("div"),this.wrapper.setAttribute("class","ss-wrapper"),this.el=e.createElement("div"),this.el.setAttribute("class","ss-content"),"rtl"===this.direction&&this.el.classList.add("rtl"),this.wrapper.appendChild(this.el);this.target.firstChild;)this.el.appendChild(this.target.firstChild);this.target.appendChild(this.wrapper),this.target.insertAdjacentHTML("beforeend",this.bar),this.bar=this.target.lastChild,function(t,i){var r;function a(t){var e=t.pageY-r;r=t.pageY,s(function(){i.el.scrollTop+=e/i.scrollRatio})}function n(){t.classList.remove("ss-grabbed"),e.body.classList.remove("ss-grabbed"),e.removeEventListener("mousemove",a),e.removeEventListener("mouseup",n)}t.addEventListener("mousedown",function(s){return r=s.pageY,t.classList.add("ss-grabbed"),e.body.classList.add("ss-grabbed"),e.addEventListener("mousemove",a),e.addEventListener("mouseup",n),!1})}(this.bar,this),this.moveBar(),t.addEventListener("resize",this.moveBar.bind(this)),this.el.addEventListener("scroll",this.moveBar.bind(this)),this.el.addEventListener("mouseenter",this.moveBar.bind(this)),this.target.classList.add("ss-container");var r=t.getComputedStyle(i);"0px"===r.height&&"0px"!==r["max-height"]&&(i.style.height=r["max-height"]),this.observer=new MutationObserver(function(t){t.length&&this.moveBar()}.bind(this)),this.observer.observe(this.el,{childList:!0,subtree:!0})}function a(){for(var t=e.querySelectorAll("*[ss-container]"),s=0;s=1?r.bar.classList.add("ss-hidden"):(r.bar.classList.remove("ss-hidden"),r.bar.style.cssText="height:"+Math.max(100*r.scrollRatio,10)+"%; top:"+r.el.scrollTop/e*100+"%;right:"+a+"px;")})}},e.addEventListener("DOMContentLoaded",a),r.initEl=i,r.initAll=a;var n=r;return n});