How to delay Jquery UIBlock Plugin?

Question

I am using this plugin. http://jquery.malsup.com/block/#overview

However I would like this blockUI to only show up say if the ajax request goes more than 1second. If no show nothing.

Is there a way I can do this?

Answer 1

When you call your AJAX, call the BlockUI in a setTimeout().

    // Using a setTimeout, display the blockUI after 1000 milliseconds
var timeout = setTimeout(function() {
    $.blockUI({ message: $('selector') }); 
}, 1000);

$.ajax({
    url:'/some/path',
    success: function( data ) {
        // your success callback
    },
    complete: function() {
           // Clear the timeout just in case the response came back
           //   in less than 1000 milliseconds
        clearTimeout(timeout);
        $.unblockUI();
    }
});