diff --git a/src/scripts/choices.ts b/src/scripts/choices.ts index e5fe566d..808606e4 100644 --- a/src/scripts/choices.ts +++ b/src/scripts/choices.ts @@ -311,6 +311,7 @@ class Choices { this._onChange = this._onChange.bind(this); this._onInvalid = this._onInvalid.bind(this); this._onWindowResize = this._onWindowResize.bind(this); + this._onScroll = this._onScroll.bind(this); // If element has already been initialised with Choices, fail silently if (this.passedElement.isActive) { @@ -1625,6 +1626,9 @@ class Choices { dropdownElement.addEventListener('keydown', this._onKeyDown, true); dropdownElement.addEventListener('mousedown', this._onMouseDown, true); window.addEventListener('resize', this._onWindowResize); + window.addEventListener('scroll', this._onScroll, { + passive: true, + }); } this.input.addEventListeners(); @@ -1668,6 +1672,7 @@ class Choices { dropdownElement.removeEventListener('keydown', this._onKeyDown); dropdownElement.removeEventListener('mousedown', this._onMouseDown); window.removeEventListener('resize', this._onWindowResize); + window.removeEventListener('scroll', this._onScroll); } this.input.removeEventListeners(); @@ -2117,6 +2122,14 @@ class Choices { } _onWindowResize(): void { + this._moveDropdown(); + } + + _onScroll(): void { + this._moveDropdown(); + } + + _moveDropdown(): void { if (!this.dropdown.isActive) { return; }