This post might help you if you want to display alert messages without using tradition javascript (irritating) alert.
To achieve this you need jQuery for your frontend UI.
Below is the javascript method (code snapshot) which displays your message for 5 seconds. And then fades out automatically.
function displayAlertMessage(message) { var timeOut = 5 jQuery('#messageBox').text(message).fadeIn() jQuery('#messageBox').css("display", "block") setTimeout(function() { jQuery('#messageBox').fadeOut() jQuery('#messageBox').css("display", "none") }, timeOut * 1000); }
messageBox is id of your div tag where you want to display the Alert Message.
timeOut is number of seconds you want to hold message on screen.
That’s it. So simple and quite comfortable from a user’s perspective Isn’t it? 
Cheers!!
Salil Kalia
This entry was posted
on June 14th, 2010
at
10:20 pm and is filed under
HTML-UI-CSS, Javascript/Ajax/JQuery .
You can follow any responses to this entry through the
RSS 2.0 feed.
You can leave a response, or trackback from your own site.
This is cool! I was looking up for something similar.
Thanks Salil Kalia!
-a
You’d better chain your jQuery commands, because a jQuery method always returns the object on which it is executed. So your code would look like this:
function displayAlertMessage(message) {
var timeOut = 5
jQuery(‘#messageBox’).text(message).fadeIn().css(“display”, “block”);
setTimeout(function() {
jQuery(‘#messageBox’).fadeOut().css(“display”, “none”);
}, timeOut * 1000);
}
Just my 2 cents
!
Thanks guys..
Arne, nice catch!
jQuery rocks!
cheers!