Question

I am creating a function where I could execute some jquery code …then pause for say… 5 secs and then execute something else..

Something like this:

function myFunc() {
    var str1 = 'This is the starting text';
        var str2 = 'This is the ending text';
          $("#label").html(str1);

        //I need a pause here (5000 ms) ---

          $("#label").html(str2);

}

How can I get a pause in there?

Answer 1

This can be done sequentially using jQuery’s queue method

The jQuery way:

$('#label')
    .queue(function (n) {
        ...your code here...
        n(); //dequeue the next item in the queue
    })
    .delay(5000)
    .queue(function (n) {
        ...your second bit of code here...
        n(); //dequeue the next item in the queue
    });

Although it’s good to understand how to use setTimeout as well.

The advantage to queue is that it works by default along with the fx queue, although you could choose to specify a different queue name.

The non-jQuery way:

function first() {
    ...your code here...
    setTimeout(second, 5000);
}
function second() {
    ...your second bit of code here...
}
first();