Timeout jQuery effects

Question

I am trying to have an element fade in  then in 5000 ms fade back out again  I know I can do something like   setTimeout function          notice   fadeOut       5000     But that will only control the fade out  would I add the above on the callback

User · Answer

This can be done with only a few lines of jQuery:

$(function(){
    // make sure img is hidden - fade in
    $('img').hide().fadeIn(2000);

    // after 5 second timeout - fade out
    setTimeout(function(){$('img').fadeOut(2000);}, 5000);
});?

see the fiddle below for a working example...

http://jsfiddle.net/eNxuJ/78/

User · Answer

I just figured it out below       notice       fadeIn  function               setTimeout  function                        notice   fadeOut  fast             2000            I will keep the post for other users

User · Answer

This can be done with only a few lines of jQuery:

$(function(){
    // make sure img is hidden - fade in
    $('img').hide().fadeIn(2000);

    // after 5 second timeout - fade out
    setTimeout(function(){$('img').fadeOut(2000);}, 5000);
});?

see the fiddle below for a working example...

http://jsfiddle.net/eNxuJ/78/

User · Answer

To be able to use it like that  you need to return this  Without the return  fadeOut  slow    will not get an object to perform that operation on   I e        fn idle   function time            var o     this         o queue function                    setTimeout function                          o dequeue                time                   return this                            Then do this       notice   fadeIn   idle 2000  fadeOut  slow

User · Answer

You can do something like this       notice        fadeIn        animate  opacity     0    2000       Does nothing for 2000ms      fadeOut  fast      Sadly  you can t just do  animate     2000  -- I think this is a bug  and will report it

User · Answer

You can do something like this       notice        fadeIn        animate  opacity     0    2000       Does nothing for 2000ms      fadeOut  fast      Sadly  you can t just do  animate     2000  -- I think this is a bug  and will report it

User · Answer

I just figured it out below       notice       fadeIn  function               setTimeout  function                        notice   fadeOut  fast             2000            I will keep the post for other users

User · Answer

You can do something like this       notice        fadeIn        animate  opacity     0    2000       Does nothing for 2000ms      fadeOut  fast      Sadly  you can t just do  animate     2000  -- I think this is a bug  and will report it

User · Answer

Ben Alman wrote a sweet plugin for jQuery called doTimeout  It has a lot of nice features   Check it out here  jQuery doTimeout  Like setTimeout  but better

User · Answer

Ben Alman wrote a sweet plugin for jQuery called doTimeout  It has a lot of nice features   Check it out here  jQuery doTimeout  Like setTimeout  but better

User · Answer

Update  As of jQuery 1 4 you can use the  delay  n   method  http   api jquery com delay       notice   fadeIn   delay 2000  fadeOut  slow       Note    show   and   hide   by default are not queued  so if you want to use   delay   with them  you need to configure them that way       notice        show  duration  0  queue  true        delay 2000       hide  duration  0  queue  true        You could possibly use the Queue syntax  this might work    jQuery function       var e       notice     e fadeIn     e queue function       setTimeout function         e dequeue          2000          e fadeOut  fast             or you could be really ingenious and make a jQuery function to do it    function         jQuery fn idle   function time             var o     this          o queue function                     setTimeout function                           o dequeue                 time                     jQuery     which would   in theory   working on memory here   permit you do to this        notice   fadeIn   idle 2000  fadeOut  slow

User · Answer

I just figured it out below       notice       fadeIn  function               setTimeout  function                        notice   fadeOut  fast             2000            I will keep the post for other users

User · Answer

You can do something like this       notice        fadeIn        animate  opacity     0    2000       Does nothing for 2000ms      fadeOut  fast      Sadly  you can t just do  animate     2000  -- I think this is a bug  and will report it

User · Answer

Great hack by  strager  Implement it into jQuery like this   jQuery fn wait   function  MiliSeconds          this  animate   opacity     0     MiliSeconds       return this      And then use it as       notice   fadeIn   wait 2000  fadeOut  slow

User · Answer

Great hack by  strager  Implement it into jQuery like this   jQuery fn wait   function  MiliSeconds          this  animate   opacity     0     MiliSeconds       return this      And then use it as       notice   fadeIn   wait 2000  fadeOut  slow

User · Answer

To be able to use it like that  you need to return this  Without the return  fadeOut  slow    will not get an object to perform that operation on   I e        fn idle   function time            var o     this         o queue function                    setTimeout function                          o dequeue                time                   return this                            Then do this       notice   fadeIn   idle 2000  fadeOut  slow

User · Answer

I just figured it out below       notice       fadeIn  function               setTimeout  function                        notice   fadeOut  fast             2000            I will keep the post for other users

User · Answer

Update  As of jQuery 1 4 you can use the  delay  n   method  http   api jquery com delay       notice   fadeIn   delay 2000  fadeOut  slow       Note    show   and   hide   by default are not queued  so if you want to use   delay   with them  you need to configure them that way       notice        show  duration  0  queue  true        delay 2000       hide  duration  0  queue  true        You could possibly use the Queue syntax  this might work    jQuery function       var e       notice     e fadeIn     e queue function       setTimeout function         e dequeue          2000          e fadeOut  fast             or you could be really ingenious and make a jQuery function to do it    function         jQuery fn idle   function time             var o     this          o queue function                     setTimeout function                           o dequeue                 time                     jQuery     which would   in theory   working on memory here   permit you do to this        notice   fadeIn   idle 2000  fadeOut  slow

User · Answer

Update  As of jQuery 1 4 you can use the  delay  n   method  http   api jquery com delay       notice   fadeIn   delay 2000  fadeOut  slow       Note    show   and   hide   by default are not queued  so if you want to use   delay   with them  you need to configure them that way       notice        show  duration  0  queue  true        delay 2000       hide  duration  0  queue  true        You could possibly use the Queue syntax  this might work    jQuery function       var e       notice     e fadeIn     e queue function       setTimeout function         e dequeue          2000          e fadeOut  fast             or you could be really ingenious and make a jQuery function to do it    function         jQuery fn idle   function time             var o     this          o queue function                     setTimeout function                           o dequeue                 time                     jQuery     which would   in theory   working on memory here   permit you do to this        notice   fadeIn   idle 2000  fadeOut  slow

User · Answer

Update  As of jQuery 1 4 you can use the  delay  n   method  http   api jquery com delay       notice   fadeIn   delay 2000  fadeOut  slow       Note    show   and   hide   by default are not queued  so if you want to use   delay   with them  you need to configure them that way       notice        show  duration  0  queue  true        delay 2000       hide  duration  0  queue  true        You could possibly use the Queue syntax  this might work    jQuery function       var e       notice     e fadeIn     e queue function       setTimeout function         e dequeue          2000          e fadeOut  fast             or you could be really ingenious and make a jQuery function to do it    function         jQuery fn idle   function time             var o     this          o queue function                     setTimeout function                           o dequeue                 time                     jQuery     which would   in theory   working on memory here   permit you do to this        notice   fadeIn   idle 2000  fadeOut  slow

[jquery] Timeout jQuery effects

http://jsfiddle.net/eNxuJ/78/

Examples related to jquery

Examples related to timeout