title: JQuery animate div "like" a Zoom
body: <p>I can never get these to work - sorry - but I I am trying to animate on a mouse over then "re-animate" on a mouse out.  I can never get <code>$('#xyz').hover(function(){'something',function(){'somethingelse'});</code> to work.  Hope you guys can help.</p>
  
  <p>What I am trying to do is animate + and - 20px (top and left) on some absolutely positioned divs and then add 40px to the width height returning to the original position/width/height on mouse out.  I haven't even got to the css widths/heights yet ....</p>
  
  <p>Here is my code (which is wrong - well it must be as it doesn't work :-) )</p>
  
  <pre><code>  $('.box').hover(function(){
  
   $(this).animate({'top':'-20','left':'-20'},function(){
  
     $(this).animate({'top':'20','left':'20' });
  
  
        });
  </code></pre>
  
  <p>Help really appreciated. Thanks in advance</p>