Question

12

jQuery move div from position 1 to 2

rated 0 times [ 19] [ 7] / answers: 1 / hits: 29618 / 12 Years ago, thu, august 9, 2012, 12:00:00

I have multiple divs (haveing same class names). I want to move the div (always same div, which has unique ID #pos1) to the div which has been clicked. So, for that purpose, I am using following code to find the position1 (of the div which I want to move) and pos2 (the div which is clicked).

However, I don't know know how can I move (animate etc) the div from one position to another. I will appriciate any help.

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



    var pos1 = jQuery(#pos1).position();

    alert(pos1.top + ', ' + pos1.left);



    var pos2 = jQuery(this).position();

    alert(pos2.top + ', ' + pos2.left);



});

Answers

Only authorized users can answer the question. Please sign in first, or register a free account.

mckenna

Add To Favorites

Follow

Total Points: 445

Total Questions: 109

Total Answers: 109

Location: Virgin Islands (U.S.)

Member since Sun, May 16, 2021

3 Years ago

mckenna questions

1 Laravel Livewire: Component in Foreach loop. Button Click shows on all items instead of Single item

Mon, Sep 6, 21, 00:00, 3 Years ago

1 Jest mock aws-sdk ReferenceError: Cannot access before initialization

Sat, Apr 11, 20, 00:00, 4 Years ago

1 Nest js POST Request Not Recognizing DTO method

Fri, Mar 20, 20, 00:00, 4 Years ago

1 How to use prop inside another prop as default value in vuejs

Thu, Mar 28, 19, 00:00, 5 Years ago

1 Javascript: Bind/unbind function behavior

Tue, Nov 27, 18, 00:00, 6 Years ago

View All

answered 12 Years ago kerryoliviaa · Accepted Answer

First of all make sure that all your .container divs are position:absolute

Then you can use the following animate function of 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

    });

});