IT Certificaions

Google Cloud Platform

Wednesday, June 20, 2012

Notification div with auto hide

If you want to create a message notification div with auto hide property using jquery, see the code here

Add this to your java script code...

 $(document).ready(function() {

$('#messageDiv').delay(5000).fadeOut('slow');
  });
-----------------------------------------------------
<style type="text/css">
notificationDiv{
  background: #FCFFB2; 
  color: white;
  font-size:13px;
   font-weight:bold;
    padding-top: 3px;
   text-align:center;
    width:300px;
     height:20px;
    
}
</style>
And create div where you want to show in your page...


    <div id=" messageDiv " class="notificationDiv" >
    This is a notification div
</div>