html5小游戏贪吃蛇手机,html5贪吃蛇小游戏

HTML

导入代码模板：

贪吃蛇

function snake(money, card) {

this.x = money;

this.y = card;

}

function n97() {

var initX = 10;

var initY = 10;

var SIZE = 20;

this.nokia6700 = new Array();

this.nokia5230 = new Array();

this.k209 = 0;

this.targetX = 0;

this.targetY = 0;

this.manager = null;

this.setObserver = function(obs) {

this.manager = obs;

}

this.init = function() {

this.nokia5230.length = 0;

this.nokia6700.length = 0;

for (i = 0; i <= SIZE + 1; i++) {

this.nokia5230[i] = new Array();

}

for (i = 0; i <= SIZE + 1; i++) {

this.nokia5230[i][0] = 1;

this.nokia5230[SIZE + 1][i] = 1;

this.nokia5230[0][i] = 1;

this.nokia5230[i][SIZE + 1] = 1;

}

for (i = 5; i <= initX; i++) {

var point = new snake(i, initY);

this.addsnake(point);

}

this.k209 = 3;

this.productFood();

}

this.move = function() {

var head = this.getHead();

var point = new snake(head.x, head.y);

switch (this.k209) {

case 1:

point.x--;

break;

case 2:

point.y--;

break;

case 3:

point.x++;

break;

case 4:

point.y++;

break;

}

this.process(point);

}

this.turn = function(code) {

var head = this.getHead();

var point = new snake(head.x, head.y);

switch (code - 36) {

case 1:

if (this.k209 == 1 || this.k209 == 3)

return;

point.x--;

break;

case 2:

if (this.k209 == 2 || this.k209 == 4)

return;

point.y--;

break;

case 3:

if (this.k209 == 1 || this.k209 == 3)

return;

point.x++;

break;

case 4:

if (this.k209 == 2 || this.k209 == 4)

return;

point.y++;

break;

}

this.k209 = code - 36;

this.process(point);

}

this.process = function(point) {

if (this.ifDie(point)) {

alert("你挂了！");

this.manager.stopGame();

return;

}

if (this.eatable(point)) {

this.manager.removesnake(point);

this.addsnake(point);

this.manager.addScore();

this.productFood();

} else {

this.addsnake(point);

this.delTailsnake();

}

}

this.ifDie = function(point) {

return this.nokia5230[point.x][point.y] == 1;

}

this.getHead = function() {

return this.nokia6700[0];

}

this.getTail = function() {

return this.nokia6700[this.nokia6700.length - 1];

}

this.eatable = function(head) {

return (head.x == this.targetX && head.y == this.targetY);

}

this.addsnake = function(point) {

this.nokia5230[point.x][point.y] = 1;

this.nokia6700.unshift(point);

this.manager.drawsnake(point);

}

this.delTailsnake = function() {

var point = this.nokia6700.pop();

this.nokia5230[point.x][point.y] = 0;

this.manager.removesnake(point);

}

this.productFood = function() {

do {

var x = Math.round(Math.random() * 100 % SIZE);

var y = Math.round(Math.random() * 100 % SIZE);

}

while (this.nokia5230[x][y] == 1)

this.targetX = x;

this.targetY = y;

this.manager.drawFood(x, y);

}

}

function Ga1900(canvasId) {

var WIDTH = 20;

var canvas = document.getElementById(canvasId);

var RED = "#FF0000"

var WHITE = "#FFFFFF";

var BLACK = "#000000";

this.cxt = canvas.getContext("2d");

var e398 = new n97();

this.moveHandle = null;

this.gamePanel = document.getElementById("gamePanel");

this.scoreLabel = document.getElementById("score");

this.maxScoreLabel = document.getElementById("highestScore");

this.step = 0;

this.score = 0;

this.maxScore = 0;

if (localStorage.maxScore)

this.maxScore = localStorage.maxScore;

this.maxScoreLabel.innerHTML = this.maxScore;

e398.setObserver(this);

this.startGame = function(step) {

this.clear();

e398.init();

this.score = 0;

this.scoreLabel.innerHTML = this.score;

this.gamePanel.onkeydown = onKeyDown;

this.gamePanel.onkeydown = onKeyDown;

this.step = parseInt(step);

this.moveHandle = setInterval(move, 500 - 50 * this.step);

}

var move = function() {

e398.move();

}

this.stopGame = function() {

this.pause();

document.getElementById("control").disabled = true;

localStorage.maxScore = this.maxScore;

}

this.pause = function() {

clearInterval(this.moveHandle);

this.gamePanel.onkeydown = null;

}

this.goon = function() {

this.gamePanel.onkeydown = onKeyDown;

this.moveHandle = setInterval(move, 500 - 50 * this.step);

}

this.addScore = function() {

this.score += this.step;

this.scoreLabel.innerHTML = this.score;

if (this.score > this.maxScore) {

this.maxScore = this.score;

this.maxScoreLabel.innerHTML = this.score;

}

}

var onKeyDown = function(e) {

if (e.which < 37 || e.which > 40)

return;

e398.turn(e.which);

}

this.removeFood = function(x, y) {

this.cxt.fillStyle = WHITE;

this.cxt.fillRect((x - 1) * WIDTH, (y - 1) * WIDTH, WIDTH, WIDTH);

}

this.drawFood = function(x, y) {

this.cxt.fillStyle = RED;

this.cxt.fillRect((x - 1) * WIDTH, (y - 1) * WIDTH, WIDTH, WIDTH);

}

this.drawsnake = function(point) {

this.cxt.fillStyle = BLACK;

this.cxt.fillRect((point.x - 1) * WIDTH, (point.y - 1) * WIDTH, WIDTH, WIDTH);

}

this.removesnake = function(point) {

this.cxt.fillStyle = WHITE;

this.cxt.fillRect((point.x - 1) * WIDTH, (point.y - 1) * WIDTH, WIDTH, WIDTH);

}

this.clear = function() {

this.cxt.fillStyle = WHITE;

this.cxt.fillRect(0, 0, 20 * WIDTH, 20 * WIDTH);

}

}

贪吃蛇

您的浏览器不支持canvas，请尝试更换浏览器，建议使用opera浏览本站，你会有更好的体验。

最高分

0

得分

0

等级:

1

2

3

4

5

6

7

8

9

9

10

11

12

13

100

开始

暂停

var gameMrg = new Ga1900("myCanvas");

function startGame(startBtn) {

var step = document.getElementById("speed").value;

gameMrg.startGame(step);

document.getElementById("gamePanel").focus();

pause = true;

var btn = document.getElementById("control");

btn.innerHTML = "暂停";

btn.disabled = false;

}

var pause = true;

function control(btn) {

if (pause) {

gameMrg.pause();

btn.innerHTML = "继续";

} else {

gameMrg.goon();

btn.innerHTML = "暂停";

document.getElementById("gamePanel").focus();

}

pause = !pause;

}