CODEWITHSUNDEEP
javascriptjqueryhtmlcss
Alaeddine
Alaeddine

Reputation: 1687

Slide div element to another element JQuery

I have an Array grid Contains some . this how how I create 

grid[row][col] = $('<div>')
        .css({
          top  : row * 100 + 'px',
          left : col * 100 + 'px'
        })
        .text(number)
        .addClass('box')
        .appendTo($('#grid'));

This function merge where I move one div to another. but i want to make an animation to slide the grid[row1][col1] div to grid[row2][col2] div.

function merge(row1, col1, row2, col2) {
    grid[row2][col2].remove();
    grid[row2][col2] = grid[row1][col1];
    grid[row1][col1] = null;
    var number = grid[row2][col2].text() * 2 ;


    grid[row2][col2]
       .css({
           top  : row2 * 100 + 'px',
           left : col2 * 100 + 'px'
        })
        .text(number);

    return true;
}

Any Idea please how to Do this.

Upvotes: 1

Views: 73

Answers (1)

Stephan Kulla
Stephan Kulla

Reputation: 5067

Instead of css() you can try animate():

grid[row2][col2].text(number);
grid[row2][col2].animate({
    top  : row2 * 100 + 'px',
    left : col2 * 100 + 'px'
})

Upvotes: 1

Related Questions