diff --git a/files/amWiki.css b/files/amWiki.css index 3f15deb..38ec5b2 100644 --- a/files/amWiki.css +++ b/files/amWiki.css @@ -135,70 +135,19 @@ footer{position:relative;width:100%;} footer .signature{position:absolute;right:20px;bottom:-5px;color:#999;} /* ---------- scroller ---------- */ -.scroller { - height: 100%; - overflow: hidden; -} -.scroller .scroller-inner { - height: 100%; - -webkit-overflow-scrolling: touch; -} -.scroller .scroller-inner.on { - overflow-y: scroll; -} -.scroller .scrollbar { - position: absolute; - top: 0; - right: 0; - width: 10px; - height: 100%; - padding: 1px 0; - opacity: 0; - transition-duration: .5s; - -moz-user-select:none; - -webkit-user-select:none; - user-select:none; - cursor: pointer; -} -.scroller:hover .scrollbar { - opacity: 1; - transition-duration: .3s; -} -.scroller .scrollbar.active { - opacity: 1; -} -.scroller .scrollbar.off { - opacity: 0; -} -.scroller .scrollbar div { - position: relative; - height: 100%; - transition-duration: .1s; -} -.scroller .scrollbar i { - position: absolute; - top: 0; - left: 4px; - width: 3px; - height: 100%; - background: rgba(50,50,50,.25); - border-radius: 2px; - transition-duration: .1s; -} -.scroller .scrollbar:active { - padding: 0; -} -.scroller .scrollbar:active div { - background: rgba(50,50,50,.07); -} -.scroller .scrollbar:active i { - left: 0; - width: 10px; - border-radius: 0; -} -body[onselectstart] { - cursor: pointer; -} +.scroller{height:100%;overflow:hidden;} +.scroller .scroller-inner{height:100%;-webkit-overflow-scrolling:touch;} +.scroller .scroller-inner.on{overflow-y:scroll;} +.scroller .scrollbar{position:absolute;top:0;right:0;width:10px;height:100%;padding:1px 0;opacity:0;transition-duration:.5s;-moz-user-select:none;-webkit-user-select:none;user-select:none;cursor:pointer;} +.scroller:hover .scrollbar{opacity:1;transition-duration:.3s;} +.scroller .scrollbar.active{opacity:1;} +.scroller .scrollbar.off{opacity:0;} +.scroller .scrollbar div{position:relative;height:100%;transition-duration:.1s;} +.scroller .scrollbar i{position:absolute;top:0;left:4px;width:3px;height:100%;background:rgba(50,50,50,.25);border-radius:2px;transition-duration:.1s;} +.scroller .scrollbar:active{padding:0;} +.scroller .scrollbar:active div{background:rgba(50,50,50,.07);} +.scroller .scrollbar:active i{left:0;width:10px;border-radius:0;} +body[onselectstart]{cursor:pointer;} /* ---------- lowBrowser ---------- */ #lowBrowser{position:fixed;top:0;left:0;z-index:9999999;width:100%;height:100%;} diff --git a/files/amWiki.scrollbar.js b/files/amWiki.scrollbar.js index 5fc7961..4e14a59 100644 --- a/files/amWiki.scrollbar.js +++ b/files/amWiki.scrollbar.js @@ -44,23 +44,19 @@ $(window).on('resize', function () { that._onWinResize(); that.checkHeight(); - that._reScroll(); }); this.$e.container.on('scrollbar', function () { that.checkHeight(); - that._reScroll(); }); this.$e.inner.on({ 'click': function () { that.checkHeight(); - that._reScroll(); }, 'scroll': function () { that._reScroll(); } }); this.checkHeight(); - this._reScroll(); this._bindAction(); }; @@ -113,8 +109,8 @@ Scroller.prototype._resize = function () { var that = this; this.data.containerH = this.$e.inner.height(); - //当内容高度小于容器时,不显示滚动条 - if (this.data.contentH < this.data.containerH) { + //当内容高度小于等于容器时,不显示滚动条 + if (this.data.contentH <= this.data.containerH) { this.data.contentH = this.data.containerH; this.$e.bar.addClass('off'); } else { @@ -153,6 +149,7 @@ this.data.contentHLast = this.data.contentH; } this._resize(); + this._reScroll(); }; //方法绑定 diff --git a/files/amWiki.testing.css b/files/amWiki.testing.css index a108d6c..321fdd3 100644 --- a/files/amWiki.testing.css +++ b/files/amWiki.testing.css @@ -6,7 +6,7 @@ .testing-show span{color:@colour-dark;} /* ---------- testing ---------- */ -.testing-box{display:none;position:absolute;top:0;right:0;width:100%;padding:45px;background-color:#fff;} +.testing-box{display:none;position:absolute;top:0;right:0;width:100%;padding:45px;min-height:100%;background-color:#fff;} .testing-box h2{position:relative;min-width:320px;padding:2px 10px;margin:5px 0;color:#fff;background-color:@colour-light;} .testing-box h2:after{position:absolute;top:0;right:-45px;width:45px;height:100%;content:" ";background-color:@colour-light;} .testing-box h2 small{position:absolute;top:0;right:0;font-size:14px;line-height:38px;font-weight:normal;} diff --git a/files/amWiki.testing.js b/files/amWiki.testing.js index 3a21f52..13b94b1 100644 --- a/files/amWiki.testing.js +++ b/files/amWiki.testing.js @@ -185,11 +185,11 @@ if (type == 'off') { this.elm.$testingShow.removeClass('on').find('span').text('测试接口'); this.elm.$testingBox.css({ - 'position': 'absolute', - 'padding': this.elm.$win.width() > 720 ? 45 : 25 + 'position': 'absolute' }); - this.elm.$view.show(); - this.elm.$testingBox.animate({ + this.elm.$view.show().addClass('scroller-content') + .next('#mainSibling').addClass('scroller-content').addClass('on'); + this.elm.$testingBox.removeClass('scroller-content').stop().animate({ 'width': '30%', 'opacity': 0 }, 200, 'swing', function () { @@ -201,17 +201,17 @@ .css({ 'display': 'block', 'width': '0', - 'min-height': this.elm.$view.height() + 90, 'opacity': 0 }) + .stop() .animate({ 'width': '100%', 'opacity': 1 }, 300, 'swing', function () { - that.elm.$view.hide(); - that.elm.$testingBox.css({ - 'position': 'relative', - 'padding': 0 + that.elm.$view.hide().removeClass('scroller-content') + .next('#mainSibling').removeClass('scroller-content').removeClass('on'); + that.elm.$testingBox.addClass('scroller-content').css({ + 'position': 'relative' }); }); }