showanimation.js

function showNumberWithAnimation(i, j, randNumber) {

    var numberCell = $('#number-cell-' + i + "-" + j);

    numberCell.css('background-color', getNumberBackgroundColor(randNumber));

    numberCell.css('color', getNumberColor(randNumber));

    numberCell.text(randNumber);

    numberCell.animate({

        width: "100px",

        height: "100px",

        top: getPosTop(i, j),

        left: getPosLeft(i, j),

    }, 50);

}

main2048.js

var board = new Array();

var score = 0;

$(document).ready(function () {

    newgame();

});

function newgame() {

    //初始化棋盘格

    init();

    //在随机两个格子生成数字

    generateOneNumber();

}

function init() {

    for (var i = 0; i < 4; i++)

        for (var j = 0; j < 4; j++) {

            var gridCell = $('#grid-cell-' + i + "-" + j);

            gridCell.css('top', getPosTop(i, j));

            gridCell.css('left', getPosLeft(i, j));

        }

}

for (var i = 0; i < 4; i++) {

    board[i] = new Array();

    for (var j = 0; j < 4; j++) {

        board[i][j] = 0;

    }

    updateBoardView();

}

function updateBoardView() {

    $(".number-cell").remove();

    for (var i = 0; i < 4; i++)

        for (var j = 0; j < 4; j++) {

            $("#grid-container").append('<div class="number-cell" id ="number-cell-' + i + '-' + j + '"></div>')

            var theNumberCell = $('#number-cell-' + i + '-' + j);

                        if (board[i][j] == 0) {

                            theNumberCell.css('width', '0px');

                            theNumberCell.css('height', '0px');

                            theNumberCell.css('top', getPosTop(i, j) + 50);

                            theNumberCell.css('left', getPosLeft(i, j) + 50);

                        }

                        else {

                            theNumberCell.css('width', '100px');

                            theNumberCell.css('height', '100px');

                            theNumberCell.css('top', getPosTop(i, j));

                            theNumberCell.css('left', getPosLeft(i, j));

                            theNumberCell.css('background-color', getNumberBackgroundColor(board[i][j]));

                            theNumberCell.css('color', getNumberColor(board[i][j]));

                            theNumberCell.text(board[i][j]);

                        }

                    }

            }

            function generateOneNumber() {

                if (nospace(board))

                    return false;

                // 随机一个位置

                var randx = parseInt(Math.floor(Math.random() * 4));

                var randy = parseInt(Math.floor(Math.random() * 4));

                while (true) {

                    if (board[randx][randy] == 0)

                        break;

                    randx = parseInt(Math.floor(Math.random() * 4));

                    randy = parseInt(Math.floor(Math.random() * 4));

                }

                // 随机一个数字

                var randNumber = Math.random() < 0.5 ? 2 : 4;

                // 在随机位置显示随机数字

                board[randx][randy] = randNumber;

                showNumberWithAnimation(randx, randy, randNumber);

                return true;

            }

support2048.js

function getPosTop(i, j) {

    return 20 + i * 120;

}

function getPosLeft(i, j) {

    return 20 + j * 120;

}

function getNumberBackgroundColor(number) {

    switch (number) {

        case 2: return "#eee4da"; break;

        case 4: return "#ede0c8"; break;

        case 8: return "#f2b179"; break;

        case 16: return "#f59563"; break;

        case 32: return "#f67e5f"; break;

        case 64: return "#f65e3b"; break;

        case 128: return "#edcf72"; break;

        case 256: return "#edcc61"; break;

        case 512: return "#9c0"; break;

        case 1024: return "#33b5e5"; break;

        case 2048: return "#09c"; break;

        case 4096: return "#a6c"; break;

        case 8192: return "#93c"; break;

    }

    return "black"

}

function getNumberColor(number) {

    if (number <= 4)

        return "#776e65";

    return "white";

}

function nospace(board) {

    for (var i = 0; i < 4; i++)

        for (var j = 0; j < 4; j++)

            if (board[i][j] == 0)

                return false;

    return true;

}