In Javascript/Jquery, how do I display a div for 5 seconds, and then have it fade out?

Question

For example, when someone clicks on a button.

Answer 1

You're looking for the delay function:

$(something).delay(5000).fadeOut();    //5,000 milliseconds

In general, you can call setTimeout:

setTimeout(function() {
    //Do things...
}, 5000);

Answer 2

In 1.4 you can use the .delay() function. Here's the documentation for that:

jQuery Docs

Alternately you could look into the native javascript setTimeOut() function.

Answer 3

If you're using the JQuery 1.4+, you could try

$('#myDiv').fadeIn('medium').delay(5000).fadeOut('medium');

You can remove the fadeIn if the div is visible straight away.

Answer 4

Use the delay function available since 1.4

From the docs: http://api.jquery.com/delay/

$('#foo').fadeIn(400).delay(5000).fadeOut(400);