jQuery move div desde la posición 1 a 2

Question

Tengo varios divs (que tienen los mismos nombres de clase). Quiero mover el div (siempre el mismo div, que tiene el ID único #pos1) al div que se ha hecho clic. Entonces, para ese propósito, estoy usando el siguiente código para encontrar la posición1 (del div que quiero mover) y pos2 (el div en el que se hace clic).

Sin embargo, no sé cómo puedo mover (animar, etc.) el div de una posición a otra. Agradecería cualquier ayuda.

jQuery(".container").click(function() { 

    var pos1 = jQuery("#pos1").position(); 
    alert(pos1.top + ', ' + pos1.left); 

    var pos2 = jQuery(this).position(); 
    alert(pos2.top + ', ' + pos2.left); 

}); 

Answer 1

En primer lugar asegúrese de que todas sus .container divs son position:absolute

continuación, puede utilizar la animate siguiente función de jQuery:

$('.container').click(function(){ 
    var pos1 = $('#pos1').position(); 

    $(this).animate({ 'top': pos1.top + 'px', 'left': pos1.left + 'px'}, 200, function(){ 
     //end of animation.. if you want to add some code here 
    }); 
}); 

Answer 2

Tanto los divs deben tener position :relative o puede haber puede darle a su división móvil un position: absolute para la parte superior e izquierda para que funcione correctamente.