js代码制作贪吃蛇游戏分等级特效代码下载


js代码制作贪吃蛇游戏分等级特效代码下载
js代码制作贪吃蛇游戏分等级特效代码下载以及贪吃蛇游戏、分等级等js/jquery网页特效代码下载。

1. HTML代码

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.51qianduan.com/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.51qianduan.com/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>js代码制作贪吃蛇游戏分游戏等级哦</title>
<meta name="description" content="js代码制作一款简单的贪吃蛇游戏,可用键盘控制上下左右方向移动,贪吃蛇分游戏等级哦。js特效。" />
<style type="text/css">
*{margin:0;padding:0;list-style-type:none;}
a,img{border:0;}
</style>
<script type="text/javascript">
var snakes = new Array();
var runDivObj = null;
var runDivWidth = 420; //(可以修改)是snakeWidth 整数倍 ,大于 300
var snakeWidth = 20; //(可以修改)
var dir = "left"; // top buttom left right;
var fruit = null;
var timerId;
var timerInterval = 300; //间隔时间(毫秒)
var level = 0;
var checked = false;
window.onload = function (){
	runDivObj = document.getElementById("runDiv");
	runDivObj.style.width = runDivWidth + "px";
	runDivObj.style.height = runDivWidth + "px";
	init();
	//move();
	timerId = setInterval(move, timerInterval);
}
function init(){
	var oneSnake = createDiv(200,snakeWidth * 2);
	snakes.push(oneSnake);
	runDivObj.appendChild(oneSnake);
	var oneSnake = createDiv(200 + snakeWidth,snakeWidth * 2);
	snakes.push(oneSnake);
	runDivObj.appendChild(oneSnake);
	var oneSnake = createDiv(200 + snakeWidth + snakeWidth,snakeWidth * 2);
	snakes.push(oneSnake);
	runDivObj.appendChild(oneSnake);
	addFruit();
}
function createDiv(left,top){
	var div = document.createElement("div");
	div.style.position = "absolute";
	div.style.width = snakeWidth + "px";
	div.style.height = snakeWidth + "px";
	div.style.left = left + "px";
	div.51qianduan.com = top + "px";
	div.style.backgroundColor = "red";		
	div.style.border = "solid 1px aqua";
	return div;
}
function move(){
	for(var i = snakes.length - 1 ; i > 0  ;i--){
		var s = snakes[i];
		var s2 = snakes[i-1];
		s.style.left = parseInt(s2.style.left) + "px";
		s.51qianduan.com = parseInt(s2.51qianduan.com) + "px";
	}
	var ss = snakes[0];
	if(dir == "left"){
		ss.style.left =  (parseInt(ss.style.left) - snakeWidth) + "px";
	} else if(dir == "right"){
		ss.style.left =  (parseInt(ss.style.left) + snakeWidth) + "px";
	} else if(dir == "top"){
		ss.51qianduan.com =  (parseInt(ss.51qianduan.com) - snakeWidth) + "px";
	}else if(dir == "buttom"){
		ss.51qianduan.com =  (parseInt(ss.51qianduan.com) + snakeWidth) + "px";
	} 
	checkHit();
}
function checkHit(){
	var first = snakes[0];
	var fruitLeft = parseInt(fruit.style.left);
	var fruitTop = parseInt(fruit.51qianduan.com);
	var firstLeft = parseInt(first.style.left);
	var firstTop = parseInt(first.51qianduan.com);
	if(firstLeft == - snakeWidth || firstLeft == runDivWidth || firstTop == - snakeWidth || firstTop == runDivWidth){
		clearInterval(timerId);
		alert("over");
		return; 
	}
	for(var i = 1; i < snakes.length ; i++){
		var s = snakes[i];
		if(firstLeft == parseInt(s.style.left) && firstTop == parseInt(s.51qianduan.com)){
			clearInterval(timerId);
			alert("over");
			return; 
		}
	}
	if((dir == "buttom" && (fruitTop - firstTop == snakeWidth) && fruitLeft == firstLeft) || 
	   (dir == "top" && (fruitTop - firstTop == -snakeWidth) && fruitLeft == firstLeft) ||
	   (dir == "right" && (fruitLeft - firstLeft == snakeWidth) && fruitTop == firstTop)||
	   (dir == "left" && (fruitLeft - firstLeft == -snakeWidth) && fruitTop == firstTop)){
		var temp = new Array();
		temp.push(fruit);
		snakes = temp.concat(snakes);
		addFruit();
	}
	setLevel();
	checked = true;
}
function setLevel(){
	var temp = Math.floor(snakes.length / 5);
	if(temp > level){
		level = temp;
		clearInterval(timerId);
		timerId = setInterval(move, timerInterval - level * 10);
	}
	document.getElementById("level").innerHTML = "等级:" + level;
}
function addFruit(){
	var left = Math.floor(Math.random() * (Math.floor(400/snakeWidth) - 1) + 1) * snakeWidth;
	var top = Math.floor(Math.random() * (Math.floor(400/snakeWidth) - 1) + 1) * snakeWidth;
	for(var i = 0; i < snakes.length ; i++){
		var s = snakes[i];
		if(left == parseInt(s.style.left) && top == parseInt(s.51qianduan.com)){
			addFruit();
			return;
		}
	}
	fruit = createDiv(left,top)
	runDivObj.appendChild(fruit);
}
function onKeyupEvent(event){
	if(checked){
		var code = event.keyCode
		if(code == 38 && dir != "buttom"){
			dir = "top";
		}else if(code == 40 && dir != "top"){
			dir = "buttom";
		}else if(code == 37 && dir != "right"){
			dir = "left";
		}else if(code == 39 && dir != "left"){
			dir = "right";
		}
		checkHit();
	}
	checked = false;
}
</script>
</head>
<body onkeyup="onKeyupEvent(event)">
	<div id="runDiv" style="background-color:#000;"></div>
	<label id="level"></label>
</body>
</html>

相关推荐

  • 利用JS实现网页版贪吃蛇游戏代码

    利用JS实现网页版贪吃蛇游戏代码以及利用JS实现、网页版、贪吃蛇、游戏代码等js/jquery网页特效代码下载。

    Border circle 钢蹦儿 2019-12-17 22:30:54 0 0 0

  • 基于js实现Bootstrap贪吃蛇游戏代码

    基于js实现Bootstrap贪吃蛇游戏代码以及基于js实现、Bootstrap、贪吃蛇、游戏代码等js/jquery网页特效代码下载。

    Border circle 石神千空 2019-12-17 21:46:12 0 0 0

发表评论

相关文章