search

GoogleChrome / dialog-polyfill

Polyfill for the HTML dialog element
BSD 3-Clause "New" or "Revised" License
2.45k stars 245 forks source link

Nested Dialogs #47

Closed neilrees closed 7 years ago

neilrees commented 9 years ago

The overlay appears in front of nested dialogs.

https://jsfiddle.net/4kdz00t5/4/

The fiddle will use the native support in Chrome and works ok, in IE11 it will use the Polyfill and you cannot interact with elements on the nested dialog.

neilrees commented 9 years ago

@samthor can I ask why this has been closed? The issue still seems to be present in the jsfiddle?

samthor commented 9 years ago

I was actually confused about the issue. I understand now: you're nesting a <dialog> within another <dialog>.

This is a known limitation as per the README - your dialogs should be children of <body>. Your fix #48 actually breaks the spec, because it means I can tap on any dialog/backdrop I can get to (even though backdrops are initially full-sized, you can shrink them).

I do have a thought: maybe the dialog overlay (different to backdrop) could always be a sibling of the currently open dialog, and that's fine since it's position: fixed, it won't be effected by its position on the page. Although it's a bit awkward.

neilrees commented 9 years ago

Thanks for reopening. Yes you're right the fix wont work as it wont mask out the parent dialog. Your thought should work though.

samthor commented 7 years ago

I've implemented the suggestion I made in Jun 2015 now - it's not perfect for modals, we'll still warn you it's probably not what you want, but it's the best we can do.