📄 snake.txt
字号:
<html>
<head>
</head>
<style>
#begin{
position:absolute;
top:33px;
left:398px;
width: 608px;
height: 609px;
border:5;
color:gray;
border-style:solid;
}
#d{
position:absolute;
left:51px;
top:36px;
width:330px;
height:138px;
border:5;
border-style:dashed;
border-color:gray;
}
#d1{
position:absolute;
left:52px;
top:199px;
width:330px;
height:145px;
border:5;
border-style:dashed;
border-color:gray;
height: 133px;
}
.STYLE1 {
font-size: 24px;
font-weight: bold;
}
.guize {
position:absolute;
left:53px;
top:356px;
width:330px;
height:280px;
border-style:solid;
}
.Food{
background-color:red;
}
.snake{
background-color:#0000FF;
}
</style>
<script>
var Rows=30;
var Cells=30;
var Num=20; //大小
var BorderWidth=5;
var SpeedUp=5000;
var Times=300;
var Map=new Array();//地图
var index=0;
var score=0;
//创建地图
function creatMap(){
for(y=0;y<Rows;y++){
Map[y]=new Array()
for(x=0;x<Cells;x++){
Map[y][x]='0';
}
}
//蛇
Sx=parseInt(Math.random()*Cells);
Sy=parseInt(Math.random()*Rows);
CreateSnake();
CreatFood();
AllDiv=document.getElementById("begin").all.tags('DIV');
AllSpan=document.getElementById("begin").all.tags('SPAN');
}
//食物的位置
function CreatFood(){
Fx=parseInt(Math.random()*Cells);
//alert(Fx);
Fy=parseInt(Math.random()*Rows);
//alert(Fy);
if(Map[Fy][Fx]=='0'){
document.getElementById("begin").innerHTML+=
'<span id=s style=position:absolute;left:'+Fx*Num+';top:'+Fy*Num+';width:'+Num+';height:'+Num+';overflow:hidden class=Food></span>';
sumScore();
index++;
Map[Fy][Fx]='F';
}
else CreatFood();
}
//蛇的
function CreateSnake(){
document.getElementById("begin").innerHTML+=
'<div x='+Sx+' y='+Sy+' style=position:absolute;left:'+Sx*Num+';top:'+Sy*Num+';width:'+Num+';height:'+Num+';overflow:hidden class=snake></div>'
Map[Sy][Sx]='S';
}
//蛇头前面的是什么
function Move(){
Sx+=GoX;
Sy+=GoY;
if(Sy<0||Sy>=Rows){
Move1();}
else{
SnakeFront=Map[Sy][Sx]
if(SnakeFront=='0'){
Move2();
}else{
if(SnakeFront=='F'){
Move3();}
else{
Move1();
}
}
}
}
//重新开始
function Move1(){
reStart=confirm("Game Over，重新开始？");
if(reStart)
window.location.reload();
}
//蛇前是空地时
function Move2(){
Map[AllDiv[0].y][AllDiv[0].x]='0';
AllDiv[0].removeNode(true);
CreateSnake();
setTimeout('Move()',Times);
}
//蛇前面是食物时
function Move3(){
CreateSnake();
AllSpan[0].removeNode(true);
CreatFood();
setTimeout('Move()',Times);
}
//蛇速度
function oTimes(){
Times-=5;
if(Times>5)
setTimeout('oTimes()',SpeedUp);
}
//方向
function KeyDown(){
Key=event.keyCode;
switch(Key){
case 37:Dir(-1,0);break;//左
case 39:Dir(1,0);break;//右
case 38:Dir(0,-1);break;//上
case 40:Dir(0,1);break;//下
}
return false;
}
document.onkeydown=KeyDown;
var Star=0;
function Dir(x,y){
GoX=x;
GoY=y;
if(Star==0){
oTimes();
Star=1;
Move();
}
}
function sumScore(){
if(index++){
score+=5;
document.getElementById("score").innerText=score;
}
}
var time0=0;
function _time(){
var str="";
if(time0%60<10){
str=parseInt(time0/60)+":0"+(time0%60);
}else{
str=parseInt(time0/60)+":"+(time0%60);
}
document.getElementById("time0").innerText=str;
time0++;
}
setTimeout('_time()',1000);
</script>
<body onLoad="creatMap()">
<div id="d">
<table width="100%" height="100%">
<tr>
<td align="right" width="50%"><font size="+2" style="font-family:黑体;color:gray"><b>持续时间：</b></font></td>
<td align="center" width="50%"><font size="+2" style="font-family:黑体;color:gray"><b id="time0">0</b></font></td>
</tr>
</table>
</div>
<div id="d1">
<table width="100%" height="100%" border="0">
<tr>
<td align="right" width="50%"><font size="+2" style="font-family:黑体;color:gray"><b>得分：</b></font></td>
<td align="center" width="50%"><font size="+2" style="font-family:黑体;color:gray"><b id="score">0</b></font></td>
</tr>
</table>
</div>
<div class="guize" style="border-style:dashed;border-color:gray;">
<table width="100%" height="100%">
<tr>
<td align="center"><font size="+2" style="font-family:黑体;color:gray"><b>操作方式</b></font></td>
</tr>
<tr>
<td><p><font style="font-family:宋体;color:gray"><br>
键盘操作：按方向键移动绿色方块（蛇），吃红色的障碍物；<br>
</font> </p></td>
</tr>
<tr>
<td align="center"><font size="+2" style="font-family:黑体;color:gray"><b>游戏规则</b></font></td>
</tr>
<tr>
<td><font style="font-family:宋体;color:gray"> 每吃一个红色的方块，绿色蛇就会增长一节，蛇不能碰到自己的身体和四周的边框。</font></td>
</tr>
</table>
</div>
<div id="begin">
</div>
</body>
</html>⌨️ 快捷键说明
复制代码
Ctrl + C
搜索代码
Ctrl + F
全屏模式
F11
切换主题
Ctrl + Shift + D
显示快捷键
?
增大字号
Ctrl + =
减小字号
Ctrl + -