Skip to content

Page scroll issue with modals with overflowing content when animation is disabled #4003

@ozguruysal

Description

@ozguruysal

Describe the bug

For modals with a long scrolling long content, if modal show/hide animation is disabled with no-fade prop, when modal is opened page scrolls to the top of the modal.

Steps to reproduce the bug

  1. Go to https://bootstrap-vue.js.org/docs/components/modal#scrolling-long-content
  2. Click on the button Launch overflowing modal. You can see that modal is opened as expected and there's a top margin on modal-dialog.
  3. Now edit the example by double clicking the code block and add no-fade prop to <b-modal> component. Then click the launch modal button again.
  4. You can see that page is scrolled to the top of the modal.

Expected behavior

Should work the same when animations are enabled.

Versions

Libraries:

  • BootstrapVue: 2.0.0-rc.28
  • Bootstrap: 4.3.1
  • Vue: 2.6.10

Environment:

  • OS: Windows 10
  • Browser: Chrome
  • Version: 76.0.3809.132 (Official Build) (64-bit)

Demo link

Reproducible at https://bootstrap-vue.js.org/docs/components/modal#scrolling-long-content

Additional context

N/A

Metadata

Metadata

Assignees

Type

No type

Projects

No projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions