diff options
Diffstat (limited to 'js/src/offcanvas.js')
-rw-r--r-- | js/src/offcanvas.js | 14 |
1 files changed, 7 insertions, 7 deletions
diff --git a/js/src/offcanvas.js b/js/src/offcanvas.js index acc0971fa2..db65340391 100644 --- a/js/src/offcanvas.js +++ b/js/src/offcanvas.js @@ -31,6 +31,8 @@ const EVENT_LOAD_DATA_API = `load${EVENT_KEY}${DATA_API_KEY}` const ESCAPE_KEY = 'Escape' const CLASS_NAME_SHOW = 'show' +const CLASS_NAME_SHOWING = 'showing' +const CLASS_NAME_HIDING = 'hiding' const CLASS_NAME_BACKDROP = 'offcanvas-backdrop' const OPEN_SELECTOR = '.offcanvas.show' @@ -99,24 +101,23 @@ class Offcanvas extends BaseComponent { } this._isShown = true - this._element.style.visibility = 'visible' - this._backdrop.show() if (!this._config.scroll) { new ScrollBarHelper().hide() } - this._element.removeAttribute('aria-hidden') this._element.setAttribute('aria-modal', true) this._element.setAttribute('role', 'dialog') - this._element.classList.add(CLASS_NAME_SHOW) + this._element.classList.add(CLASS_NAME_SHOWING) const completeCallBack = () => { if (!this._config.scroll) { this._focustrap.activate() } + this._element.classList.add(CLASS_NAME_SHOW) + this._element.classList.remove(CLASS_NAME_SHOWING) EventHandler.trigger(this._element, EVENT_SHOWN, { relatedTarget }) } @@ -137,14 +138,13 @@ class Offcanvas extends BaseComponent { this._focustrap.deactivate() this._element.blur() this._isShown = false - this._element.classList.remove(CLASS_NAME_SHOW) + this._element.classList.add(CLASS_NAME_HIDING) this._backdrop.hide() const completeCallback = () => { - this._element.setAttribute('aria-hidden', true) + this._element.classList.remove(CLASS_NAME_SHOW, CLASS_NAME_HIDING) this._element.removeAttribute('aria-modal') this._element.removeAttribute('role') - this._element.style.visibility = 'hidden' if (!this._config.scroll) { new ScrollBarHelper().reset() |