A simple Windows 8 modal. Click the 'Open Modal' button below to check it out.
Been looking around for a CSS/JS Windows 8 Modal, could have skinned other modals just to look like this. Made this from scratch for personal purposes. 'CSS transforms' centers the modal vertically. Doesn't depend on jQuery. The CSS file doesn't include normalize or reset.
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="css/win8modal.css" type="text/css" />
<script src="js/win8modal.js"></script>
</head>
<body>
<button type="button" data-wm-role="open">
Open Modal
</button>
<div class="win8modal">
<button type="button" data-wm-role="close">Close Modal</button>
</div>
<div class='win8modal-cover'></div>
<script type="text/javascript">
Win8Modal.install();
</script>
</body>
</html>
Made by Ace Subido | http://acesubido.com
To close the modal, click the 'Close Modal' button below.
Clicking outside the modal also closes the modal.
You can also hit the ESC to close this modal.
If you like this, also check out CSS Microsoft Metro Buttons