diff options
| author | Mark Otto <[email protected]> | 2017-05-30 08:46:33 -0700 |
|---|---|---|
| committer | Mark Otto <[email protected]> | 2017-05-30 08:46:33 -0700 |
| commit | d4eb0d4e739477fc51421eed29906addfd998a04 (patch) | |
| tree | 5ffe09c63ac4e522890fc7b2b87c0a47b0f1a971 /js/src/scrollspy.js | |
| parent | 0c12ccbeb6fdf0dd3818f97260aa43c79108d377 (diff) | |
| parent | f95cbc5950bf31995f33023014c47a61665ffacc (diff) | |
| download | bootstrap-d4eb0d4e739477fc51421eed29906addfd998a04.tar.xz bootstrap-d4eb0d4e739477fc51421eed29906addfd998a04.zip | |
Merge branch 'v4-docs-streamlined' of https://github.com/twbs/bootstrap into v4-docs-streamlined
Diffstat (limited to 'js/src/scrollspy.js')
| -rw-r--r-- | js/src/scrollspy.js | 37 |
1 files changed, 20 insertions, 17 deletions
diff --git a/js/src/scrollspy.js b/js/src/scrollspy.js index 84fa9d6a4..7ea9f2483 100644 --- a/js/src/scrollspy.js +++ b/js/src/scrollspy.js @@ -3,7 +3,7 @@ import Util from './util' /** * -------------------------------------------------------------------------- - * Bootstrap (v4.0.0-alpha.5): scrollspy.js + * Bootstrap (v4.0.0-alpha.6): scrollspy.js * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE) * -------------------------------------------------------------------------- */ @@ -18,7 +18,7 @@ const ScrollSpy = (($) => { */ const NAME = 'scrollspy' - const VERSION = '4.0.0-alpha.5' + const VERSION = '4.0.0-alpha.6' const DATA_KEY = 'bs.scrollspy' const EVENT_KEY = `.${DATA_KEY}` const DATA_API_KEY = '.data-api' @@ -45,18 +45,15 @@ const ScrollSpy = (($) => { const ClassName = { DROPDOWN_ITEM : 'dropdown-item', DROPDOWN_MENU : 'dropdown-menu', - NAV_LINK : 'nav-link', - NAV : 'nav', ACTIVE : 'active' } const Selector = { DATA_SPY : '[data-spy="scroll"]', ACTIVE : '.active', - LIST_ITEM : '.list-item', - LI : 'li', - LI_DROPDOWN : 'li.dropdown', + NAV_LIST_GROUP : '.nav, .list-group', NAV_LINKS : '.nav-link', + LIST_ITEMS : '.list-group-item', DROPDOWN : '.dropdown', DROPDOWN_ITEMS : '.dropdown-item', DROPDOWN_TOGGLE : '.dropdown-toggle' @@ -81,6 +78,7 @@ const ScrollSpy = (($) => { this._scrollElement = element.tagName === 'BODY' ? window : element this._config = this._getConfig(config) this._selector = `${this._config.target} ${Selector.NAV_LINKS},` + + `${this._config.target} ${Selector.LIST_ITEMS},` + `${this._config.target} ${Selector.DROPDOWN_ITEMS}` this._offsets = [] this._targets = [] @@ -133,12 +131,15 @@ const ScrollSpy = (($) => { target = $(targetSelector)[0] } - if (target && (target.offsetWidth || target.offsetHeight)) { - // todo (fat): remove sketch reliance on jQuery position/offset - return [ - $(target)[offsetMethod]().top + offsetBase, - targetSelector - ] + if (target) { + const targetBCR = target.getBoundingClientRect() + if (targetBCR.width || targetBCR.height) { + // todo (fat): remove sketch reliance on jQuery position/offset + return [ + $(target)[offsetMethod]().top + offsetBase, + targetSelector + ] + } } return null }) @@ -198,7 +199,7 @@ const ScrollSpy = (($) => { _getOffsetHeight() { return this._scrollElement === window ? - window.innerHeight : this._scrollElement.offsetHeight + window.innerHeight : this._scrollElement.getBoundingClientRect().height } _process() { @@ -256,9 +257,11 @@ const ScrollSpy = (($) => { $link.closest(Selector.DROPDOWN).find(Selector.DROPDOWN_TOGGLE).addClass(ClassName.ACTIVE) $link.addClass(ClassName.ACTIVE) } else { - // todo (fat) this is kinda sus... - // recursively add actives to tested nav-links - $link.parents(Selector.LI).find(`> ${Selector.NAV_LINKS}`).addClass(ClassName.ACTIVE) + // Set triggered link as active + $link.addClass(ClassName.ACTIVE) + // Set triggered links parents as active + // With both <ul> and <nav> markup a parent is the previous sibling of any nav ancestor + $link.parents(Selector.NAV_LIST_GROUP).prev(`${Selector.NAV_LINKS}, ${Selector.LIST_ITEMS}`).addClass(ClassName.ACTIVE) } $(this._scrollElement).trigger(Event.ACTIVATE, { |
