原生js实现一个简单的贪吃蛇小游戏效果代码

代码语言:html

所属分类:游戏

代码描述:原生js实现一个简单的贪吃蛇小游戏效果代码

代码标签: 一个 简单 贪吃 小游戏 效果

下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">


<style>
	canvas{ border: 1px solid #000000;}
</style>

</head>
<body>

<canvas width="980" height="600" id="canvas"></canvas>

<script>
	//初始化变量
	var foods = new Array();    //存放食物坐标
	var gameover = false; //游戏结束
	var gridWidth = 10;  //正方形长度
	var canvas = document.getElementById("canvas");
	var ctx = canvas.getContext("2d");  //构建画布
	//食物定时器、蛇定时器、场景、蛇对象
	var food_interval,snake_interval,Farm,Snake;


	//方格对象
	function node(x,y,w)
	{
		var self = this;
		self.x = x;
		self.y = y;
		self.w = w;

		//食物初始化
		self.foodInit = function()
		{
			ctx.fillStyle = "#FF0000";
			ctx.fillRect(self.x,self.y,self.w,self.w);
		}

		//蛇的初始化
		self.snakeInit = function()
		{
			ctx.fillStyle = "#000000";
			ctx.strokeStyle = "#FFFFFF";
			ctx.fillRect(x,y,w,w);
			ctx.strokeRect(x,y,w,w);
		}

		//判断两个方块是否重合
		self.equals = function(node)
		{
			if(self.x == node.x && self.y == node.y)
			{
				return true;
			}else{
				return false;
			}
		}

		//清除格子  让格子跟背景颜色一样
		self.clear = functi.........完整代码请登录后点击上方下载按钮下载查看

网友评论0