javascript制作2048游戏_jquery_脚本之家

2048.html

2048   tap to start :-) 

2048.css

@charset "utf-8"; #div2048{ width: 500px; height: 500px; background-color: #b8af9e; margin: 0 auto; position: relative;}#start{ width: 500px; height: 500px; line-height: 500px; display: block; text-align: center; font-size: 30px; background: #f2b179; color: #FFFFFF;}#div2048 div.tile{ margin: 20px 0px 0px 20px; width: 100px; height: 40px; padding: 30px 0; font-size: 40px; line-height: 40px; text-align: center; float: left;}#div2048 div.tile0{ background: #ccc0b2;}#div2048 div.tile2{ color: #7c736a; background: #eee4da;}#div2048 div.tile4{ color: #7c736a; background: #ece0c8;}#div2048 div.tile8{ color: #fff7eb; background: #f2b179;}#div2048 div.tile16{ color:#fff7eb; background:#f59563;}#div2048 div.tile32{ color:#fff7eb; background:#f57c5f;}#div2048 div.tile64{ color:#fff7eb; background:#f65d3b;}#div2048 div.tile128{ color:#fff7eb; background:#edce71;}#div2048 div.tile256{ color:#fff7eb; background:#edcc61;}#div2048 div.tile512{ color:#fff7eb; background:#ecc850;}#div2048 div.tile1024{ color:#fff7eb; background:#edc53f;}#div2048 div.tile2048{ color:#fff7eb; background:#eec22e;}

2048.js

function game2048{ this.container = container; this.tiles = new Array;} game2048.prototype = { init: function(){ for(var i = 0, len = this.tiles.length; i < len; i++){ var tile = this.newTile; tile.setAttribute; this.container.appendChild; this.tiles[i] = tile; } this.randomTile; }, newTile: function{ var tile = document.createElement; this.setTileVal return tile; }, setTileVal: function{ tile.className = 'tile tile' + val; tile.setAttribute; tile.innerHTML = val > 0 ? val : ''; }, randomTile: function(){ var zeroTiles = []; for(var i = 0, len = this.tiles.length; i < len; i++){ if(this.tiles[i].getAttribute{ zeroTiles.push; } } var rTile = zeroTiles[Math.floor * zeroTiles.length)]; this.setTileVal < 0.8 ? 2 : 4); }, move:function{ var j; switch{ case 'W': for(var i = 4, len = this.tiles.length; i < len; i++){ j = i; while{ this.merge(this.tiles[j - 4], this.tiles[j]); j -= 4; } } break; case 'S': for(var i = 11; i >= 0; i--){ j = i; while{ this.merge(this.tiles[j + 4], this.tiles[j]); j += 4; } } break; case 'A': for(var i = 1, len = this.tiles.length; i < len; i++){ j = i; while{ this.merge(this.tiles[j - 1], this.tiles[j]); j -= 1; } } break; case 'D': for(var i = 14; i >= 0; i--){ j = i; while{ this.merge(this.tiles[j + 1], this.tiles[j]); j += 1; } } break; } this.randomTile(); }, merge: function{ var prevVal = prevTile.getAttribute; var currVal = currTile.getAttribute; if{ if{ this.setTileVal; this.setTileVal; } else if{ this.setTileVal(prevTile, prevVal * 2); this.setTileVal; } } }, equal: function{ return tile1.getAttribute == tile2.getAttribute; }, max: function(){ for(var i = 0, len = this.tiles.length; i < len; i++){ if(this.tiles[i].getAttribute{ return true; } } }, over: function(){ for(var i = 0, len = this.tiles.length; i < len; i++){ if(this.tiles[i].getAttribute{ return false; } if{ if(this.equal(this.tiles[i], this.tiles[i + 1])){ return false; } } if{ if(this.equal(this.tiles[i], this.tiles[i + 4])){ return false; } } } return true; }, clean: function(){ for(var i = 0, len = this.tiles.length; i < len; i++){ this.container.removeChild; } this.tiles = new Array; }} var game, startBtn; window.onload = function(){ var container = document.getElementById; startBtn = document.getElementById; startBtn.onclick = function(){ this.style.display = 'none'; game = game || new game2048; game.init(); }} window.onkeydown = function{ var keynum, keychar; if{ // IE keynum = e.keyCode; } else if{ // Netscape/Firefox/Opera keynum = e.which; } keychar = String.fromCharCode; if(['W', 'S', 'A', 'D'].indexOf{ if{ game.clean(); startBtn.style.display = 'block'; startBtn.innerHTML = 'game over, replay?'; return; } game.move; }}

以上所诉就是本文的全部内容了,希望大家能够喜欢。