diff --git a/docs/4.0/components/dropdowns.md b/docs/4.0/components/dropdowns.md index 25ebae75db..80d461cac4 100644 --- a/docs/4.0/components/dropdowns.md +++ b/docs/4.0/components/dropdowns.md @@ -807,6 +807,12 @@ Options can be passed via data attributes or JavaScript. For data attributes, ap 'toggle' Reference element of the dropdown menu. Accepts the values of 'toggle', 'parent', or an HTMLElement reference. For more information refer to Popper.js's referenceObject docs. + + display + string + dynamic | static + By default, we use Popper.js for dynamic positioning. Disable this with `static`. + diff --git a/js/src/dropdown.js b/js/src/dropdown.js index 82deaa2205..b877017f2b 100644 --- a/js/src/dropdown.js +++ b/js/src/dropdown.js @@ -75,14 +75,16 @@ const Dropdown = (($) => { offset : 0, flip : true, boundary : 'scrollParent', - reference : 'toggle' + reference : 'toggle', + display : 'dynamic' } const DefaultType = { offset : '(number|string|function)', flip : 'boolean', boundary : '(string|element)', - reference : '(string|element)' + reference : '(string|element)', + display : 'string' } /** @@ -295,6 +297,12 @@ const Dropdown = (($) => { } } + // Disable Popper.js if we have a static display + if (this._config.display === 'static') { + popperConfig.modifiers.applyStyle = { + enabled: false + } + } return popperConfig } diff --git a/js/tests/unit/dropdown.js b/js/tests/unit/dropdown.js index 97ceb65961..3040e81b41 100644 --- a/js/tests/unit/dropdown.js +++ b/js/tests/unit/dropdown.js @@ -908,4 +908,34 @@ $(function () { }) $textarea.trigger('click') }) + + QUnit.test('should not use Popper.js if display set to static', function (assert) { + assert.expect(1) + var dropdownHTML = + '
-
+
-
+
+
+ +