diff --git a/js/dist/dropdown.js b/js/dist/dropdown.js index a8e785e72076..d46e94380ce4 100644 --- a/js/dist/dropdown.js +++ b/js/dist/dropdown.js @@ -88,15 +88,6 @@ var Dropdown = function ($) { return false; } - if ('ontouchstart' in document.documentElement && !$(parent).closest(Selector.NAVBAR_NAV).length) { - - // if mobile we use a backdrop because click events don't delegate - var dropdown = document.createElement('div'); - dropdown.className = ClassName.BACKDROP; - $(dropdown).insertBefore(this); - $(dropdown).on('click', Dropdown._clearMenus); - } - var relatedTarget = { relatedTarget: this }; @@ -108,6 +99,16 @@ var Dropdown = function ($) { return false; } + // set the backdrop only if the dropdown menu will be opened + if ('ontouchstart' in document.documentElement && !$(parent).closest(Selector.NAVBAR_NAV).length) { + + // if mobile we use a backdrop because click events don't delegate + var dropdown = document.createElement('div'); + dropdown.className = ClassName.BACKDROP; + $(dropdown).insertBefore(this); + $(dropdown).on('click', Dropdown._clearMenus); + } + this.focus(); this.setAttribute('aria-expanded', true); @@ -154,11 +155,6 @@ var Dropdown = function ($) { return; } - var backdrop = $(Selector.BACKDROP)[0]; - if (backdrop) { - backdrop.parentNode.removeChild(backdrop); - } - var toggles = $.makeArray($(Selector.DATA_TOGGLE)); for (var i = 0; i < toggles.length; i++) { @@ -181,6 +177,12 @@ var Dropdown = function ($) { continue; } + // remove backdrop only if the dropdown menu will be hidden + var backdrop = $(parent).find(Selector.BACKDROP)[0]; + if (backdrop) { + backdrop.parentNode.removeChild(backdrop); + } + toggles[i].setAttribute('aria-expanded', 'false'); $(parent).removeClass(ClassName.SHOW).trigger($.Event(Event.HIDDEN, relatedTarget));