Purpose: delays execution of a call to jQuery object by a set amount of time. Unlike just setting a simple timeout, the "this" pointer inside the executed callback will be the jQuery object used to assign the delay. For example:
delayedFadeOut: function(delay, speed, callback) {
this.delayed(delay, function() {
this.fadeOut(speed, callback);
});
return this;
}
Thus, you could write:
var myFn = ;
$(".myClass").delayedFadeOut(250, "normal",
function() {
$(this).css("background-color", "blue");
});
Within the callback, you have access to the jQuery object so, in the example, all of the elements with the "myClass" class would get the background color of blue when the fade completes. The nice part is, the fade doesn't occur until the timeout has expired.
Here is the new method:
delayed: function(delay, callback) {
var delayFn = function() {
arguments.callee.jQ.each(function() {
arguments.callee.callback.call(arguments.callee.jQ);
});
};
delayFn.jQ = this;
delayFn.callback = callback;
return setTimeout(delayFn, delay);
}
I use method wrapping to avoid closures and memory leaks in the delayFn method below. An example of my use is to delay a hover state so that the overlayed button doesn't appear immediately. I find this very handy instead of creating a ton of "window.timeout" calls.
