javascript - jQuery将div从位置1移动到2

Question

我有多个 div（具有相同的类名）。我想将 div （总是相同的 div，具有唯一 ID #pos1）移动到已单击的 div 。因此，为此，我使用以下代码来查找 position1（我要移动的 div 的）和 pos2（被点击的 div）。

但是，我不知道如何将 div 从一个位置移动（动画等）到另一个位置。我会给予任何帮助。

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

首先确保你所有的.containerdiv 都是position:absolute

然后就可以使用animatejQuery的如下功能了：

$('.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

两个 div 都应该有position :relative或者可能是你可以给你的移动 div 一个position: absolute顶部和左侧以正常工作。