Dialog

Details
Written by: Stanko Milosev
Category: HTML5
Hits: 11607
One example of dialog in Chrome, in FireFox it is not working.

HTML: 

<!DOCTYPE html>
<html>
	<body>
	
		<dialog class="modal">
			<p>This is da dialog!</p>
			<button id="close">Close</button>
		</dialog>
		<button id="show">Open Dialog!</button>
		
	</body>
</html>
JS: 
<script type="text/javascript">	
	var dialog = document.querySelector('dialog');
	document.querySelector('#show').onclick = function() {
	  dialog.show();
	};
	document.querySelector('#close').onclick = function() {
	  dialog.close();
	};
</script>
Here note line:

document.querySelector('dialog')

this is something new what I learned today.

Live example:

This is da dialog!

Example taken from this web site, via this one. On Tympanus you can find few more examples of overlay window, if you need support for older browsers.