Question

I have a page which issues several ajax queries in $('document').ready(). I want to use fadeIn() or animation() to display some information for a few seconds after received the first ajax call.

Will the following js/ajax calls be blocked during the animation playing? Or should I use setTimeout to delay the animation a second so the ajax calls can be started asynchronously?

Edit:

My code will look like this. Will the others ajax calls be blocked for 5 seconds?

$.ajax({..., success: function(result) {
    $('#msg').html(result.xxx);
    $('#msg').fadeIn(5000);

    // Other ajax calls
    $.ajax(....)
    ....
}

Answer 1

Yes, they are non-blocking. The animation methods just initiate the animation and returns immediately.

Any code that updates the user interface has to be non-blocking, as the user interface isn’t updated while any function is running.