fade out div after x seconds with jquery

Question

I do a fade in div that is not displayed when I load the page:

    $(\'#overlay\').fadeIn(\'fast\');
    $(\'#box\').fadeIn(\'slow\');

I would

Answer 1

Maybe this is too late to reply but I found a way which helped me.

$("#overlay").fadeTo(10000,1).fadeOut(5000);

Refer this link http://juristr.com/blog/2009/12/howto-fade-out-div-after-some-seconds/

It allows you to set a time like when you want the div to disappear and with what speed.

Answer 2

You could use setTimeout()

var xSeconds = 1000; // 1 second

setTimeout(function() {
   $('#overlay').fadeOut('fast');
   $('#box').hide();
}, xSeconds);

Answer 3

The .delay method is purpose built for what you are describing:

$('#overlay').fadeIn('fast').delay(1000).fadeOut('fast');
$('#box').fadeIn('slow').delay(1000).hide(0);

http://jsfiddle.net/SUBnz/1/