Source Code:
(back to article)
Submit
Result:
Report an issue
<!DOCTYPE html> <html> <head> <title>Title of the document</title> <style> dialog { width: 40%; } </style> </head> <body> <div> <dialog id="DialogExample"> <p> Here is some text for example. </p> <button id="hide">Close dialog text</button> </dialog> <button id="show">Show dialog text</button> </div> <script type="text/JavaScript"> (function() { var dialog = document.getElementById('DialogExample'); document.getElementById('show').onclick = function() { dialog.show(); }; document.getElementById('hide').onclick = function() { dialog.close(); }; })(); </script> </body> </html>