Skip to main content

Bug Tracker

Side navigation

#2250 closed enhancement (invalid)

Opened January 28, 2008 08:51PM UTC

Closed July 01, 2008 03:08AM UTC

Last modified March 15, 2012 09:58AM UTC

Addition of "delayed" method to jQuery

Reported by: bfattori Owned by:
Priority: minor Milestone: 1.3
Component: core Version: 1.2.2
Keywords: delayed,timeout Cc:
Blocked by: Blocking:

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() {;				
	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.

Attachments (0)
Change History (2)

Changed January 28, 2008 08:52PM UTC by bfattori comment:1

Arggg... ignore the "var myFn = ;" in the second code block. :-/

Changed July 01, 2008 03:08AM UTC by flesler comment:2

resolution: → invalid
status: newclosed

This is really not needed on the core. You can surely make a plugin to add thi functionality externally.