win8-notify

A windows 8.x style notification system using CSS3 and JQuery.

Live Demo at Win8-Notify Demonstration Page

Getting Started

1. Get the source code from here
2. Include the CSS File in your page.

   <link rel="stylesheet" type="text/css" href="css/win8-notify.css">

3. Add the Shortcode with the required color to get the Notification. For Example to get a black Notification.

   <div id="notification" class="notification black"> 	<div class="dark-back"></div> 	<div class="win8-notif-body"> 		<div class="mid"> 			<h3>THis is the Notification heading</h3> 			<p>This is the demo notifification descrption that can be long enough, Like your account has been succesfully hacked....</p> 			<button class="win8-notif-button">OK</button> 			<button class="win8-notif-button">CANCEL</button> 		</div> 	</div> </div>

4. You can also use Jquery or Natice Js to add this shortcode to the body when the Notifications is to be displayed. For example to show a green Notification.

   $('body').append( 	<div id="notification" class="notification green"> 		<div class="dark-back"></div> 		<div class="win8-notif-body"> 			<div class="mid"> 				<h3>THis is the Notification heading</h3> 				<p>This is the demo notifification descrption that can be long enough, Like your account has been succesfully hacked....</p> 				<button class="win8-notif-button">OK</button> 				<button class="win8-notif-button">CANCEL</button> 			</div> 		</div> 	</div> );