HTML 5.2: The <dialog> Element

HTML 5.2 has introduced a new <dialog> element to show modal dialog boxes. Here’s a small demo by @bdc (forked version by me, including polyfill):

Already available in Chrome; a polyfill is available for other/older browsers.

Meet the New Dialog Element →
Polyfill for the HTML <dialog> element →

Siderant: I cannot help it, but my inner geek has issues with the language used to control the dialog.

The attribute to indicate whether a modal is open/visible/shown or not is named open, so I’m taking that as the baseline.

Now, say you want to open a modal via JavaScript you don’t call, but you have have to call modal.showModal(). Why not open (like the attribute) but show as the verb? And why the Modal suffix?

And now comes the even more inconsistent part: to close it, you don’t call modal.hideModal() (which is the exact opposite of modal.showModal()) nor modal.closeModal(), but modal.close().

Weird … 🤔

Published by Bramus!

Bramus is a frontend web developer from Belgium, working as a Chrome Developer Relations Engineer at Google. From the moment he discovered view-source at the age of 14 (way back in 1997), he fell in love with the web and has been tinkering with it ever since (more …)

Join the Conversation


Leave a comment

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.