A popover backdrop anti-pattern

https://remysharp.com/2026/05/08/popover-backdrop-anti-pattern

10 points · 2 comments · view on lemmy.world

2 Comments

LPThinker@lemmy.world · 5 pts · 135d

For what it's worth, the Popover documentation is very explicit that <dialog> is the only right tool for the job when you want a modal:

  • modal, meaning that while a popover is being shown, the rest of the page is rendered non-interactive until the popover is actioned in some way (for example an important choice is made).

  • non-modal, meaning that the rest of the page can be interacted with while the popover is being shown.

Popovers created using the Popover API are always non-modal. If you want to create a modal popover, a <dialog> element is the right way to go.

nous@programming.dev · 4 pts · 136d

Both examples have the same behavior for me on firefox mobile. So their solution isn't universal for all browsers :(