Skip to content
This repository was archived by the owner on Sep 22, 2022. It is now read-only.

Option to preventScroll on focus #62

Open
evanminto opened this issue Mar 15, 2021 · 2 comments
Open

Option to preventScroll on focus #62

evanminto opened this issue Mar 15, 2021 · 2 comments

Comments

@evanminto
Copy link

I’m running into a problem where the calls to focus() are jumping the scroll around on my page. Specifically in Chrome with the dialogs inside of a sticky header. Changing .focus() to .focus({ preventScroll: true }) fixes the issue.

I’d love to have a prevent-scroll attribute on the <details-dialog> to opt into this behavior.

@koddsson
Copy link
Contributor

👋🏻 Do you have any reproduction code so we can take a look?

@evanminto
Copy link
Author

My bad, should have tried to isolate the problem before I sent in the issue. Turns out it was being caused by an interaction in Chrome between position: sticky and scroll-margin. I fixed it by removing the latter. Here’s a CodePen if anyone runs into this in their own code: https://codepen.io/vamptvo/pen/LYbKyPj

This option might still be useful in some other cases, but in this case it wasn’t directly related, so feel free to close this.

Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants