javascript - HTML5 <Dialog> Only works on chrome? -

using dialog on website appears work on chrome, on other browsers , on iphone dialog open permanently , on place. there should using instead of <dialog>?

<p><button id="launchstyledmodal">learn more</button></p>   <dialog id="styledmodal">     insert dialog text here     <button id="close">close</button>   </dialog>  <script src="js/dialog.js"></script> 

javascript:

window.onload = function () {  // buttons.  var styledmodalbtn = document.getelementbyid('launchstyledmodal'); var close = document.getelementbyid('close');   // dialogs. var styledmodal = document.getelementbyid('styledmodal');  // setup event listeners  styledmodalbtn.addeventlistener('click', function(e)  {    e.preventdefault();    styledmodal.showmodal();  });  close.addeventlistener('click', function(e)  {     this.parentnode.close(); });   }; 

html5 dialog works in following browsers:

• chrome 37+
• opera 29+
• android browser 40+
• chrome android 42+

for more info visit http://caniuse.com/#search=dialog

there polyfill available on github: https://github.com/googlechrome/dialog-polyfill