jQuery animando a la posición original

Question

Tengo un sitio en el que estoy trabajando que tiene algunos divs posicionados de manera absoluta que necesito cambiar el tamaño al hacer clic, estos llenarán el contenedor donde están los divs. La pregunta es ¿Cómo puedo activarlos para alternar y volver a la posición original (arriba, izquierda) que es diferente para cada uno?

$(".work-item .toggle").toggle(function() { 
     $(this).parent().animate({ height: '430', width: '930', top: '0', left: '0' }, 750); 
    }, 
    function() { 
     var pos   = $(this).parent(); 
     var position = pos.position();  

     $(this).parent().animate({ height: '150', width: '200', top: position.top, left: position.left }, 750); 
    }); 

Probé lo anterior pero está obteniendo la nueva posición, no la original.

Gracias de antemano.

PVS

Answer 1

Puede almacenar la posición cuando la página se carga por primera usando $.data() y utilizarla más tarde, como esto:

$(".work-item .toggle").each(function() { 
    $.data(this, 'position', $(this).parent().position()); 
}).toggle(function() { 
    $(this).parent().animate({ height: '430', width: '930', top: '0', left: '0' }, 750); 
}, function() { 
    var position = $.data(this, 'position'); 
    $(this).parent().animate({ height: '150', width: '200', top: position.top, left: position.left }, 750); 
}); 

Esto almacena el .position() para los padres de cada elemento justo antes de que ates, a continuación, lo usa cuando se anima más tarde.