JQuery delay before fadeOut

jquery delay
user2220474 picture user2220474 · Mar 28, 2013 · Viewed 23.6k times · Source

I have written a jquery script that allows me to fade divs in and out, then repeat. The code works fine. However, when I try to add a delay (I want the div to stay up a few seconds before fading out), it does not work properly. I've tried adding the delay in several places inside the code and none seem to function properly. I am using Jquery version 1.9.1

Here is the script that I have written:

$(document).ready(function(){
   ShowPostDiv(0);
});

function ShowPostDiv(divIndex)
{
    $(".home_entry_txt").hide();

    if(divIndex >= $(".rotate_hide").length)
    {
        divIndex = 0;
    }
    var divPostHtml = $(".rotate_hide:eq("+divIndex+")").html();
    $(".home_entry_txt").html(divPostHtml); 
    $(".home_entry_txt").fadeIn(3000, function(){
             $(".home_entry_txt").fadeOut("slow");
        });
    divIndex++;
    setTimeout("ShowPostDiv("+divIndex+")", 4000);
}

Answer

enb081 picture enb081 · Mar 28, 2013

You can just write 

$(".home_entry_txt").fadeIn(3000).delay(1000).fadeOut("slow");

Related questions

JavaScript sleep/wait before continuing

I have a JavaScript code that I need to add a sleep/wait function to. The code I am running is already in a function, eg: function myFunction(time) { alert('time starts now'); //code to make the program wait before …

Read More
Proper way to wait for one function to finish before continuing?

I have two JS functions. One calls the other. Within the calling function, I'd like to call the other, wait for that function to finish, then continue on. So, for example/pseudo code: function firstFunction(){ for(i=0;i<x;…

Read More
jQuery: Wait/Delay 1 second without executing code

I can't get the .delay method working in jQuery: $.delay(3000); // not working $(queue).delay(3000); // not working I'm using a while loop to wait until an uncontrolled changing value is greater than or equal to another and I can't find any …

Read More