using jquery how to use fadein, delay and then fadeout issue

Question

hi, I need to make something fadeIn, then stay there for a second and then fadeOut using JQuery.

I've tried this but it dosent work for some reason???

$('#' + uMessage).fadeIn("fast").fadeOut("slow");  // works
$('#' + uMessage).fadeIn("fast").delay(1000).fadeOut("slow");  // fails

any suggestions where im going wrong?

Many thanks!!!

Answer 1

Your second approach should be fine actually, corresponding to the docs (http://api.jquery.com/delay/)

Another approach may be to use the callback function which is called when the fadeIn has finished:

$('#' + uMessage).fadeIn("fast", function() { $(this).delay(1000).fadeOut("slow"); });

just a guess

Edit:

If you can't use the delay() method, then you could try this one:

$('#' + uMessage).fadeIn("fast", function() { 
  c_obj = $(this);
  window.setTimeout(function() { $(c_obj).fadeOut("slow"); }, 1000); 
});

Here's an example: http://jsfiddle.net/KwWFR/

Answer 2

Maybe try using a callback as specified in the API for FadeIn function. This will be called once the fade in is completed.

$('#' + uMessage).fadeIn("fast", function() {
  $(this).delay(1000).fadeOut("slow");
});

Answer 3

I think the problem lies in the version of jQuery you use:

http://jsfiddle.net/b85hx/

This one works fine. Switch to 1.3.2 and it's broken.

Answer 4

Are you using jQuery 1.4+? The delay() function was added in jQuery 1.4

http://api.jquery.com/delay/