There is a new version of this plugin for jQuery 1.2.x
Introduction
The jQuery Fx Queues plugin is a global queueing (duh!) system that
allows to enqueue effects of different elements, but also keeps jQuery’s default
queueing option.
A wait argument was also added to be able to
specify the time to wait before starting the animation.
Download
Queues
A queue is an array that may contain animations to perform and/or
scopes.
You just have to pass its name (with the animate’s “queue” argument) to add an animation
to a queue. If the queue doesn’t exist, then it creates it automatically.
In case a name is not passed, then a queue for the element is created.
Scopes
What happens if you needed to enqueue not a single effect, but a group of effects
to be played altogether? This is where scopes come to save the day.
A scope is an object that can be contained in a queue. It is an array that contains
only animations to perform. When a scope is dequeued, it automatically
plays all the animations it contains.
You just have to pass its name (with the animate’s “scope” argument) to add an animation
to a queue’s scope. If the scope doesn’t exist, then it creates it automatically.
New arguments added to animate:
- queue: (string) Name of the queue. If it doesn’t exist, it creates the new queue.
- scope: (string) Name of the scope.
- queuePosition: (”front”|”end”) Queue position where animation (or scope,
if passed) is queued. - wait: (int) Milliseconds to wait before starting the animation.
Usage:
animate(properties, speed, easing, callback, queue, scope, queuePosition, wait)
$(”#myId”).animate(
{marginLeft: “10px”},
{speed: 500,
queue: “first”
});
Since these arguments are available in the new
animate implementation,
they can be used in the other effects, like:
$(”#myId”).fadeIn({
speed: 500,
queue: “first”,
scope: “global”,
wait: 500
});
Useful functions
Three functions were created to manage the queues, which can be found in the jQuery.fxQueues object.
- jQuery.fxQueues.clear( queueName )
- jQuery.fxQueues.start( queueName )
- jQuery.fxQueues.stop( queueName )
Examples
Changelog
- 11-21-2007:
- Renamed functions (start, stop and clear)
- Fixed stop method when stopping an animation queued with a wait time.
- 11-19-2007: First release.