Jquery $('#div').show().delay(5000).hide(); doesn't work

I'm trying to show a div thats set to display: none; for 5 seconds with

$('#div').show().delay(5000).hide();

but it deson't work, it just goes straight to hide()

Can any of you help me?


Do it like this:

$('#div').show(0).delay(5000).hide(0);

By passing in numbers to .show() and .hide(), jQuery will take those methods into its internal fx queue (even if the number is zero). Since .delay() only works within a queue, you need that little workaround.

example: http://jsfiddle.net/zceKN/


You need to use .queue() because .hide() isn't queued by default.

$("#div").show().delay(5000).queue(function (next) {
    $(this).hide();
    next();
});