jQuery Animate with a percentage placed Div

jQuery Animate with a percentage placed Div

I have divs on a page that are placed in the center with something like
  1. width:100px;height:100px;position:fixed;top:50%;left:50%;margin:-50px, 0, 0, -50px;
I want to animate this div to the bottom left (similar to minimizing effect on windows)

I am trying to use 
  2. .animate({
  3. opacity: 0.25,
  4. left: '10px',
  5.                 bottom: '10px';
  6. height: 'toggle'
  7.  }, 5000);
However when I activate this it simply jumps (or glitches) to that position, the opacity and height animate perfectly.

Is there a way to make this work correctly?