HTML5 Dialog Element Polyfill

Category: Javascript , Modal & Popup | January 17, 2018
Author: GoogleChrome
Views Total: 849
Official Page: Go to website
Last Update: January 17, 2018
License: MIT


HTML5 Dialog Element Polyfill


A JavaScript polyfill for the HTML5 <dialog> element to create interactive dialog UI components on all major browsers.

How to use it:

Insert the ‘dialog-polyfill.css’ and ‘dialog-polyfill.js’ into your document.

<link href="dialog-polyfill.css" rel="stylesheet">
<script src="dialog-polyfill.js"></script>

Create a native dialog element.

  <p>This is a dialog!</p>
  <button id="close">Close</button>

Register the dialog element and done.

var dialog = document.querySelector('dialog');


document.querySelector('#show').onclick = function() {;

document.querySelector('#close').onclick = function() {

Leave a Reply