twitter style update message display script

Hello Friends

Here is the script to display confirmation or error message in twitter style. 
You just need to write the message in  <div id="alert"> ...............</div> whatever you want . After that add the javascript code written below.

<style type="text/css">
background-color: #ccc;
color: #000;

overflow: hidden;
width: 1260px;
text-align: center;
position: absolute;
top: 0;
left: 0;
background-color: #fff;
height: 0;
color: #000;
font: 20px/40px arial, sans-serif;
opacity: .9;

<div id="alert">
Thank you. Your message has been sent

<script type="text/javascript" src=""></script>
<script type="text/javascript">
$(function () {
var $alert = $('#alert');
var alerttimer = window.setTimeout(function () {
}, 3000);
$alert.animate({height: $alert.css('line-height') || '50px'}, 200)
.click(function () {
$alert.animate({height: '0'}, 200);

If you have to display more than one message, just add one more id style like "#cancel", and copy the style properties and do the same code for that message. write the  <div id="cancel"> ...............</div> whatever you want . After that write the javascript code and change that id's name.

You will see a slide down effect on the screen.


Popular posts from this blog

How to fix 500 internal privoxy error

jQuery & JavaScript PDF Viewer plugin

ubuntu package installation