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 $('#xyz').hover(function(){'something',function(){'somethingelse'}); to work. Hope you guys can help.

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 ....

Here is my code (which is wrong - well it must be as it doesn't work :-) )

  $('.box').hover(function(){

 $(this).animate({'top':'-20','left':'-20'},function(){

   $(this).animate({'top':'20','left':'20' });


      });

Help really appreciated. Thanks in advance