title: Using jQuery.queue with multiple element animations?
body: <p>jQuery queue's are very annoying - I can't get my head around it...</p>
  
  <p>The following function contains 4 animations which I want to happen one after the other (not at the same time).</p>
  
  <pre><code>function startupAnime() {
  
      $("#header").animate({"opacity":"1"},{duration:3000, queue:"global"});
      $("#header").animate({"top":"0px"},{duration:3000, queue:"global"});
      &amp;("#loader").animate({"opacity":"0"},{duration:3000, queue:"global"});
      $("#background").animate({"background-position" : "300px center"},{duration:3000, queue:"global"});
  }
  
  $(window).load(function() { 
  
      startupAnime();
  })
  </code></pre>
  
  <p>The two #header elements will animate one after the other, but the rest all happen at the same time.</p>
  
  <p>I then found out the Queue only works if your animating the same element!! That's not very useful...
  But adding queue:"name" apparently is supposed to link them into the same queue... although this just stops them from working for me.</p>
  
  <p>Am I missing something here?  I'm not sure if queue means 'next animation will start when current one is finished', or 'these animations are being held in a queue waiting for you to release them' by maybe calling queue("global") or something!?</p>
  
  <p>Most suggestions talk about animating one element, or setting up many functions and using callback to 'iterate' through the functions - not very clean if you ask me.  I simply want to be able to run a list of animations whenever I ask for it.</p>
  
  <p>NB: A 'list' of animations might animate elements one at a time, but I also might want two or more elements to animate at the same time at some point in the list. Here's a sample:</p>
  
  <pre><code>animate element A
  -&gt; then -&gt;
  animate element B
  -&gt; then -&gt;
  animate element C and D together
  -&gt; then -&gt;
  animate element E
  </code></pre>