I have several animations that I want to perform on different objects in the dom.
I want them to occur in order.
I do not want to do it like this:
$('#first').show(800, function () { $('#second').show(800, function () {...etc...}); I want to add all my animations(and cpu intensive functions) to some kind of queue object that will make sure they execute sequentially.
I'm not sure why you don't want to use the method you described. If its purely from an organizational standpoint you don't have to use anonymous functions
function showFirst() { $('#first').show(800, showSecond); } function showSecond() { $('#second').show(800, showThird); } function showThird() { $('#third').show(800); } function startAnimation() { showFirst(); } 
Check out the documentation for jQuery Effects. The stuff about queuing should do what you need.
I've just used this plugin, http://plugins.jquery.com/project/timers, the other day to do a similar thing. Your basically iterating through all the matched dom elements and then performing an animation each one when the index * your millisecond count.
The code was something like this:
HTML:
<div id="wrapper"> <div>These</div> <div>Show</div> <div>In</div> <div>Order</div> </div> jQuery
$("#wrapper div").foreach( function(i) { i = i + 1; $(this).oneTime(800 * i, "show", function() { $(this).show(); }); }); 
This would also work.
$('#first').show(800); setTimeout("$('#second').show(800)", 800); setTimeout("$('#third').show(800)", 1600); setTimeout("$('#forth').show(800)", 2400); I know its not purely sequential, but I find it makes it easy to read and allows you to set off animations with more flexability.
Note: That you have to quote the code you want executed. I haven't used any double quotes in the previous code but if you did you would have escape them as follows.
$('#first').animate({"width":"100px"}, 500); setTimeout("$('#second').animate({\"width\":\"100px\"}, 500)", 800); setTimeout("$('#third').animate({\"width\":\"100px\"}, 500)", 1600); setTimeout("$('#forth').animate({\"width\":\"100px\"}, 500)", 2400); You can usually avoid this by alternating which quotes you use, but though it was worth a mention.
UPDATE: Here is another option, and it's also worth checking out jquery promises here
$('#first').show(800); $('#second').delay(800).show(800); $('#third').delay(1600).show(800); $('#forth').delay(2400).show(800); 
