javascript - 将 div 元素滑动到另一个元素 JQuery

Question

我有一个数组 网格包含一些。这就是我如何创建

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

此函数 merge 我将一个 div 移动到另一个。但我想制作一个动画，将 grid[row1][col1] div 滑动到 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;
}

任何想法请如何做到这一点。

Answer 1

你可以试试 animate() 而不是 css() :

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