lxm_front/eruda
1
0
Fork 0
mirror of https://github.com/liriliri/eruda.git synced 2026-03-20 09:38:37 +08:00
Code Issues Projects Releases Wiki Activity

Dev: Optimize nav bar item display

Browse Source
This commit is contained in:
surunzi
2017-12-13 21:25:12 +08:00
parent 460c239712
commit 00f9dc11de
1 changed files with 25 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

25
src/DevTools/NavBar.js
View File

@@ -52,6 +52,7 @@ export default class NavBar extends util.Emitter
{ {
$this.addClass('eruda-active'); $this.addClass('eruda-active');
self._resetBottomBar(); self._resetBottomBar();
self._scrollItemToView();
} else } else
{ {
$this.rmClass('eruda-active'); $this.rmClass('eruda-active');
@@ -63,6 +64,30 @@ export default class NavBar extends util.Emitter
util.evalCss.remove(this._style); util.evalCss.remove(this._style);
this._$el.remove(); this._$el.remove();
} }
_scrollItemToView()
{
let $el = this._$el,
li = $el.find('.eruda-active').get(0),
container = $el.get(0);
let itemLeft = li.offsetLeft,
itemWidth = li.offsetWidth,
containerWidth = container.offsetWidth,
scrollLeft = container.scrollLeft,
targetScrollLeft;
if (itemLeft < scrollLeft)
{
targetScrollLeft = itemLeft;
} else if (itemLeft + itemWidth > containerWidth + scrollLeft)
{
targetScrollLeft = itemLeft + itemWidth - containerWidth;
}
if (!util.isNum(targetScrollLeft)) return;
container.scrollLeft = targetScrollLeft;
}
_resetBottomBar() _resetBottomBar()
{ {
let $bottomBar = this._$bottomBar; let $bottomBar = this._$bottomBar;