How to create jQuery info/pop-up boxes

[Dan06]

I'd like to display a message box that fades in, remains for a few seconds, and then fades out. Additionally, I'd like the box to have only a message/image, no prompts, i.e. ok, cancel, etc.

 

Does anyone have any examples for or tutorials of what I've described using jQuery?

[KevinM1]

I'd like to display a message box that fades in, remains for a few seconds, and then fades out. Additionally, I'd like the box to have only a message/image, no prompts, i.e. ok, cancel, etc.

 

Does anyone have any examples for or tutorials of what I've described using jQuery?

 

I don't know of any tutorials that combine all of the behaviors you want, but I'm pretty sure it's possible.  Your best bet may be to combine jQuery's effects (easiest are show and hide: http://docs.jquery.com/Effects) with JavaScript's own setTimeout function.  Something like (this is pseudo-code):

 

On page load, show the box:

$(document).ready(function()
{
   $("#myBoxId").show();

 

Set the time out:

   var timeoutHandle = setTimeout("$('#myBoxId').hide()", 5000); //hide after 5 seconds
});

[Dan06]

Thanks for the pseudo-code, I used it as a guide to make the code for the message box that fades in/out with 3 seconds. The only change I made was using .fadeIn() and .fadeOut() instead of .show() and .hide()