jQuery 1.4 Animation Techniques - Index of

[ 65 ]
Chapter 3
We pass a callback function into the fadeIn() method used with the new . In this
function, we just call the dequeue() method. This is required for the next function in the
queue to be executed; if we don't do this, only the first function in our custom queue will
be executed.
Next we define our replacement queue, after first caching a selector for the #fader
element. The new queue is defined as an array where each item consists of an anonymous
function which in turn invokes our colorChange() function, passing in the cached selector
and a CSS color name.
Finally, we call an effect method on the target element and queue up some additional
effects as we did before. This time when we call the queue() method, we supply our
custom queue, which replaces the default fx queue created by the chained fade methods.
When we run the page in a browser, we see that the first effect is applied, and then our
queue of custom colorChange functions is called. The two fade effects that would have
been in the default fx queue originally are not executed.
Pop quiz – replacing the queue
1. What do we need to pass to the queue() method in order to replace the queue?
a. A string containing a function reference
b. The dequeue() method
c. An array
d. A Boolean
2. What is an easy way of clearing the default fx queue, other than using the
clearQueue() method?
a. Passing the string clear to the queue() method
b. Passing the integer 0 to the queue() method
c. Passing the Boolean false to the queue() method
d. Passing an empty array to the queue() method
Ensuring custom queues iterate correctly
When we create custom queues, the chained methods are not automatically called for us.
This is something we need to do manually and is handled using the dequeue() method as
we saw in the previous example.