js方块躲避游戏代码

更新时间：2008年05月08日 12:11:50 作者：

鼠标控制，空色方块不要让蓝色方块碰到就可以，看能玩多久，是个javascript不错的一个游戏啊，想用js写游戏的朋友可以参考下，看代码应该是国外的人写的

鼠标拖动红色方块，就可以开始，不要让蓝色方块碰到你控制的红色方块

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">  <HTML><HEAD><TITLE>www.jb51.net脚本之家 Escapa!红方块躲避游戏</TITLE> <META http-equiv=Content-Type content="text/html; charset=windows-1252"> <SCRIPT language=JavaScript type=text/javascript> isNS4 = (document.layers) ? true : false; isIE4 = (document.all && !document.getElementById) ? true : false; isIE5 = (document.all && document.getElementById) ? true : false; isNS6 = (!document.all && document.getElementById) ? true : false; var curX, curY, curX2, curY2, boxX, boxY, moving=0, touch=0; var gametime=0, started=0, speed; var starttime, endtime, finaltime=0; //pass finaltime to popup window to ask for initials var enemyxdir = new Array(1,1,1,1); var enemyydir = new Array(1,1,1,1); if (isNS4 || isNS6){ document.captureEvents(Event.MOUSEUP|Event.MOUSEDOWN|Event.MOUSEMOVE); } document.onmousedown = start; document.onmousemove = checkLocation; document.onmouseup = stop; function startclock() {var today = new Date(); starttime = today.getTime();} function endclock() {var today = new Date(); endtime = today.getTime();} function calctime() {var time = (endtime - starttime - 0)/1000;    return time;} function giveposX(divname) {     if (isNS4) var posLeft = document.layers[divname].left;     else if (isIE4 || isIE5) var posLeft = document.all(divname).style.pixelLeft;     else if (isNS6) var posLeft = parseInt(document.getElementById(divname).style.left + "");     return posLeft; } function giveposY(divname) {     if (isNS4) var posTop = document.layers[divname].top;     else if (isIE4 || isIE5) var posTop = document.all(divname).style.pixelTop;     else if (isNS6) var posTop = parseInt(document.getElementById(divname).style.top + "");     return posTop; } function setposX(divname, xpos) {     if (isNS4) document.layers[divname].left = xpos;     else if (isIE4 || isIE5) document.all(divname).style.pixelLeft = xpos;     else if (isNS6) document.getElementById(divname).style.left = xpos; } function setposY(divname, ypos) {     if (isNS4) document.layers[divname].top = ypos;     else if (isIE4 || isIE5) document.all(divname).style.pixelTop = ypos;     else if (isNS6) document.getElementById(divname).style.top = ypos; } function givesize(divname, dimension) {     var divsize = 0;         if (dimension == 'y') {             if (isNS4) divsize = document.layers[divname].clip.height;             else if (isIE4 || isIE5) divsize = document.all(divname).style.pixelHeight;             else if (isNS6) divsize = parseInt(document.getElementById(divname).style.height + "");         }         else if (dimension == 'x') {             if (isNS4) divsize = document.layers[divname].clip.width;             else if (isIE4 || isIE5) divsize = document.all(divname).style.pixelWidth;             else if (isNS6) divsize = parseInt(document.getElementById(divname).style.width + "");         }     return divsize; } // check to see if 'box' is touching 'enemy1' function checktouching(num) {     var enemy = "enemy" + num + ""     var difX = giveposX('box') - giveposX(enemy) - 0; // -0 converts to integer     var difY = giveposY('box') - giveposY(enemy) - 0;     // set touch = 1 if it is touching an enemy     if (difX > (-1 * givesize('box', 'x')) && difX < givesize(enemy, 'x') && difY > (-1 * givesize('box', 'y')) && difY < givesize(enemy, 'y')) {         touch = 1;     }     else touch = 0; } function movenemy(num,step_x,step_y){     var enemy = "enemy" + num + ""     var enemyx = givesize(enemy, 'x');     var enemyy = givesize(enemy, 'y');     if (giveposX(enemy) >= (450 - enemyx) || giveposX(enemy) <= 0) {         enemyxdir[num] = -1 * enemyxdir[num];         }     if (giveposY(enemy) >= (450 - enemyy) || giveposY(enemy) <= 0) {         enemyydir[num] = -1 * enemyydir[num];         }     var newposx = giveposX(enemy) + (step_x*enemyxdir[num]) + 0;     var newposy = giveposY(enemy) + (step_y*enemyydir[num]) + 0;     setposX(enemy, newposx);     setposY(enemy, newposy);     checktouching(num + "");     if (touch == 1) {         stop(); reset();         } } function movenemies() {     gametime = gametime + 1     if (gametime >= 0 && gametime < 100) speed = 80;     else if (gametime >= 100 &&  gametime < 200) speed = 60;     else if (gametime >= 200 &&  gametime < 300) speed = 40;     else if (gametime >= 300 &&  gametime < 400) speed = 30;     else if (gametime >= 400 &&  gametime < 500) speed = 20;     else speed = 10;     // window.status = "speed:  " + speed + "   gametime: " + gametime;     movenemy(0,-10,12);     movenemy(1,-12,-20);     movenemy(2,15,-13);     movenemy(3,17,11);     setTimeout(movenemies,speed); } function start(e) {     if (started == 0) {    movenemies();     startclock();     started = 1;    }     curX = (isNS4 || isNS6) ? e.pageX : window.event.x ;     curY = (isNS4 || isNS6) ? e.pageY : window.event.y ;     curX2 = eval(curX - 40);     curY2 = eval(curY - 40);     boxX = eval(curX - 20);     boxY = eval(curY - 20);     var boxleft = giveposX('box');     var boxtop = giveposY('box');     if (curX > boxleft && curX2 < boxleft && curY > boxtop && curY2 < boxtop) {         moving = 1;         setposX('box', boxX);         setposY('box', boxY);         if (isNS4 || isNS6){         document.captureEvents(Event.MOUSEMOVE);         }     } } function stop(e){     moving=0;     if (isNS4 || isNS6){     document.releaseEvents(Event.MOUSEMOVE);     } } function reset(e){     endclock();     moving=0;     if (isNS4 || isNS6){         document.releaseEvents(Event.MOUSEMOVE);         }     if (finaltime == 0) {         finaltime = calctime();         window.alert('You hold ' + finaltime + ' seconds... salutations Fp'); //        var entername = window.confirm('Enter your name?'); //            if (entername) { //            window.open("?" + finaltime,'winwin','width=300,height=500,left=40,top=40,status=1,resizable'); //            document.location.reload(); //            } //            else document.location.reload();             document.location.reload();         } } function checkLocation(e){         curX = (isNS4 || isNS6) ? e.pageX : window.event.x ;         curY = (isNS4 || isNS6) ? e.pageY : window.event.y ;         boxX = eval(curX - 20);         boxY = eval(curY - 20);     checktouching('1');     if (moving == 1 && touch == 0){             setposX('box',boxX);             setposY('box',boxY);             if (curY > 69 && curX > 69 && curY < 381 && curX < 381) return false;             else stop(); reset();     }     else if (touch == 1){     stop(); reset();     } } </SCRIPT> <META content="MSHTML 6.00.2800.1106" name=GENERATOR></HEAD> <BODY text=#000000 bgColor=#ffffff leftMargin=0 topMargin=0 marginwidth="0" marginheight="0"> <DIV id=box style="LEFT: 205px; WIDTH: 40px; POSITION: absolute; TOP: 205px; HEIGHT: 40px; BACKGROUND-COLOR: #990000; layer-background-color: #990000"> <TABLE height=40 width=40>   <TBODY>   <TR>     <TD>&nbsp;</TD></TD></TR></TBODY></TABLE></DIV> <DIV id=enemy0 style="LEFT: 270px; WIDTH: 60px; POSITION: absolute; TOP: 60px; HEIGHT: 50px; BACKGROUND-COLOR: #000099; layer-background-color: #000099"> <TABLE height=50 width=60>   <TBODY>   <TR>     <TD>&nbsp;</TD></TR></TBODY></TABLE></DIV> <DIV id=enemy1 style="LEFT: 300px; WIDTH: 100px; POSITION: absolute; TOP: 330px; HEIGHT: 20px; BACKGROUND-COLOR: #000099; layer-background-color: #000099"> <TABLE height=20 width=100>   <TBODY>   <TR>     <TD>&nbsp;</TD></TR></TBODY></TABLE></DIV> <DIV id=enemy2 style="LEFT: 70px; WIDTH: 30px; POSITION: absolute; TOP: 320px; HEIGHT: 60px; BACKGROUND-COLOR: #000099; layer-background-color: #000099"> <TABLE height=60 width=30>   <TBODY>   <TR>     <TD>&nbsp;</TD></TR></TBODY></TABLE></DIV> <DIV id=enemy3 style="LEFT: 70px; WIDTH: 60px; POSITION: absolute; TOP: 70px; HEIGHT: 60px; BACKGROUND-COLOR: #000099; layer-background-color: #000099"> <TABLE height=60 width=60>   <TBODY>   <TR>     <TD>&nbsp;</TD></TR></TBODY></TABLE></DIV> <TABLE cellSpacing=0 cellPadding=0 border=0>   <TBODY>   <TR>     <TD width=50 bgColor=#000000 height=50>       <TABLE>         <TBODY>         <TR>           <TD></TD></TR></TBODY></TABLE></TD>     <TD width=50 bgColor=#000000 height=50>       <TABLE>         <TBODY>         <TR>           <TD></TD></TR></TBODY></TABLE></TD>     <TD width=50 bgColor=#000000 height=50>       <TABLE>         <TBODY>         <TR>           <TD></TD></TR></TBODY></TABLE></TD>     <TD width=50 bgColor=#000000 height=50>       <TABLE>         <TBODY>         <TR>           <TD></TD></TR></TBODY></TABLE></TD>     <TD width=50 bgColor=#000000 height=50>       <TABLE>         <TBODY>         <TR>           <TD></TD></TR></TBODY></TABLE></TD>     <TD width=50 bgColor=#000000 height=50>       <TABLE>         <TBODY>         <TR>           <TD></TD></TR></TBODY></TABLE></TD>     <TD width=50 bgColor=#000000 height=50>       <TABLE>         <TBODY>         <TR>           <TD></TD></TR></TBODY></TABLE></TD>     <TD width=50 bgColor=#000000 height=50>       <TABLE>         <TBODY>         <TR>           <TD></TD></TR></TBODY></TABLE></TD>     <TD width=50 bgColor=#000000 height=50>       <TABLE>         <TBODY>         <TR>           <TD></TD></TR></TBODY></TABLE></TD></TR>   <TR>     <TD width=50 bgColor=#000000 height=50>       <TABLE>         <TBODY>         <TR>           <TD></TD></TR></TBODY></TABLE></TD>     <TD width=50 height=50>       <TABLE>         <TBODY>         <TR>           <TD></TD></TR></TBODY></TABLE></TD>     <TD width=50 height=50>       <TABLE>         <TBODY>         <TR>           <TD></TD></TR></TBODY></TABLE></TD>     <TD width=50 height=50>       <TABLE>         <TBODY>         <TR>           <TD></TD></TR></TBODY></TABLE></TD>     <TD width=50 height=50>       <TABLE>         <TBODY>         <TR>           <TD></TD></TR></TBODY></TABLE></TD>     <TD width=50 height=50>       <TABLE>         <TBODY>         <TR>           <TD></TD></TR></TBODY></TABLE></TD>     <TD width=50 height=50>       <TABLE>         <TBODY>         <TR>           <TD></TD></TR></TBODY></TABLE></TD>     <TD width=50 height=50>       <TABLE>         <TBODY>         <TR>           <TD></TD></TR></TBODY></TABLE></TD>     <TD width=50 bgColor=#000000 height=50>       <TABLE>         <TBODY>         <TR>           <TD></TD></TR></TBODY></TABLE></TD></TR>   <TR>     <TD width=50 bgColor=#000000 height=50>       <TABLE>         <TBODY>         <TR>           <TD></TD></TR></TBODY></TABLE></TD>     <TD width=50 height=50>       <TABLE>         <TBODY>         <TR>           <TD></TD></TR></TBODY></TABLE></TD>     <TD width=50 height=50>       <TABLE>         <TBODY>         <TR>           <TD></TD></TR></TBODY></TABLE></TD>     <TD width=50 height=50>       <TABLE>         <TBODY>         <TR>           <TD></TD></TR></TBODY></TABLE></TD>     <TD width=50 height=50>       <TABLE>         <TBODY>         <TR>           <TD></TD></TR></TBODY></TABLE></TD>     <TD width=50 height=50>       <TABLE>         <TBODY>         <TR>           <TD></TD></TR></TBODY></TABLE></TD>     <TD width=50 height=50>       <TABLE>         <TBODY>         <TR>           <TD></TD></TR></TBODY></TABLE></TD>     <TD width=50 height=50>       <TABLE>         <TBODY>         <TR>           <TD></TD></TR></TBODY></TABLE></TD>     <TD width=50 bgColor=#000000 height=50>       <TABLE>         <TBODY>         <TR>           <TD></TD></TR></TBODY></TABLE></TD></TR>   <TR>     <TD width=50 bgColor=#000000 height=50>       <TABLE>         <TBODY>         <TR>           <TD></TD></TR></TBODY></TABLE></TD>     <TD width=50 height=50>       <TABLE>         <TBODY>         <TR>           <TD></TD></TR></TBODY></TABLE></TD>     <TD width=50 height=50>       <TABLE>         <TBODY>         <TR>           <TD></TD></TR></TBODY></TABLE></TD>     <TD width=50 height=50>       <TABLE>         <TBODY>         <TR>           <TD></TD></TR></TBODY></TABLE></TD>     <TD width=50 height=50>       <TABLE>         <TBODY>         <TR>           <TD></TD></TR></TBODY></TABLE></TD>     <TD width=50 height=50>       <TABLE>         <TBODY>         <TR>           <TD></TD></TR></TBODY></TABLE></TD>     <TD width=50 height=50>       <TABLE>         <TBODY>         <TR>           <TD></TD></TR></TBODY></TABLE></TD>     <TD width=50 height=50>       <TABLE>         <TBODY>         <TR>           <TD></TD></TR></TBODY></TABLE></TD>     <TD width=50 bgColor=#000000 height=50>       <TABLE>         <TBODY>         <TR>           <TD></TD></TR></TBODY></TABLE></TD></TR>   <TR>     <TD width=50 bgColor=#000000 height=50>       <TABLE>         <TBODY>         <TR>           <TD></TD></TR></TBODY></TABLE></TD>     <TD width=50 height=50>       <TABLE>         <TBODY>         <TR>           <TD></TD></TR></TBODY></TABLE></TD>     <TD width=50 height=50>       <TABLE>         <TBODY>         <TR>           <TD></TD></TR></TBODY></TABLE></TD>     <TD width=50 height=50>       <TABLE>         <TBODY>         <TR>           <TD></TD></TR></TBODY></TABLE></TD>     <TD width=50 height=50>       <TABLE>         <TBODY>         <TR>           <TD></TD></TR></TBODY></TABLE></TD>     <TD width=50 height=50>       <TABLE>         <TBODY>         <TR>           <TD></TD></TR></TBODY></TABLE></TD>     <TD width=50 height=50>       <TABLE>         <TBODY>         <TR>           <TD></TD></TR></TBODY></TABLE></TD>     <TD width=50 height=50>       <TABLE>         <TBODY>         <TR>           <TD></TD></TR></TBODY></TABLE></TD>     <TD width=50 bgColor=#000000 height=50>       <TABLE>         <TBODY>         <TR>           <TD></TD></TR></TBODY></TABLE></TD></TR>   <TR>     <TD width=50 bgColor=#000000 height=50>       <TABLE>         <TBODY>         <TR>           <TD></TD></TR></TBODY></TABLE></TD>     <TD width=50 height=50>       <TABLE>         <TBODY>         <TR>           <TD></TD></TR></TBODY></TABLE></TD>     <TD width=50 height=50>       <TABLE>         <TBODY>         <TR>           <TD></TD></TR></TBODY></TABLE></TD>     <TD width=50 height=50>       <TABLE>         <TBODY>         <TR>           <TD></TD></TR></TBODY></TABLE></TD>     <TD width=50 height=50>       <TABLE>         <TBODY>         <TR>           <TD></TD></TR></TBODY></TABLE></TD>     <TD width=50 height=50>       <TABLE>         <TBODY>         <TR>           <TD></TD></TR></TBODY></TABLE></TD>     <TD width=50 height=50>       <TABLE>         <TBODY>         <TR>           <TD></TD></TR></TBODY></TABLE></TD>     <TD width=50 height=50>       <TABLE>         <TBODY>         <TR>           <TD></TD></TR></TBODY></TABLE></TD>     <TD width=50 bgColor=#000000 height=50>       <TABLE>         <TBODY>         <TR>           <TD></TD></TR></TBODY></TABLE></TD></TR>   <TR>     <TD width=50 bgColor=#000000 height=50>       <TABLE>         <TBODY>         <TR>           <TD></TD></TR></TBODY></TABLE></TD>     <TD width=50 height=50>       <TABLE>         <TBODY>         <TR>           <TD></TD></TR></TBODY></TABLE></TD>     <TD width=50 height=50>       <TABLE>         <TBODY>         <TR>           <TD></TD></TR></TBODY></TABLE></TD>     <TD width=50 height=50>       <TABLE>         <TBODY>         <TR>           <TD></TD></TR></TBODY></TABLE></TD>     <TD width=50 height=50>       <TABLE>         <TBODY>         <TR>           <TD></TD></TR></TBODY></TABLE></TD>     <TD width=50 height=50>       <TABLE>         <TBODY>         <TR>           <TD></TD></TR></TBODY></TABLE></TD>     <TD width=50 height=50>       <TABLE>         <TBODY>         <TR>           <TD></TD></TR></TBODY></TABLE></TD>     <TD width=50 height=50>       <TABLE>         <TBODY>         <TR>           <TD></TD></TR></TBODY></TABLE></TD>     <TD width=50 bgColor=#000000 height=50>       <TABLE>         <TBODY>         <TR>           <TD></TD></TR></TBODY></TABLE></TD></TR>   <TR>     <TD width=50 bgColor=#000000 height=50>       <TABLE>         <TBODY>         <TR>           <TD></TD></TR></TBODY></TABLE></TD>     <TD width=50 height=50>       <TABLE>         <TBODY>         <TR>           <TD></TD></TR></TBODY></TABLE></TD>     <TD width=50 height=50>       <TABLE>         <TBODY>         <TR>           <TD></TD></TR></TBODY></TABLE></TD>     <TD width=50 height=50>       <TABLE>         <TBODY>         <TR>           <TD></TD></TR></TBODY></TABLE></TD>     <TD width=50 height=50>       <TABLE>         <TBODY>         <TR>           <TD></TD></TR></TBODY></TABLE></TD>     <TD width=50 height=50>       <TABLE>         <TBODY>         <TR>           <TD></TD></TR></TBODY></TABLE></TD>     <TD width=50 height=50>       <TABLE>         <TBODY>         <TR>           <TD></TD></TR></TBODY></TABLE></TD>     <TD width=50 height=50>       <TABLE>         <TBODY>         <TR>           <TD></TD></TR></TBODY></TABLE></TD>     <TD width=50 bgColor=#000000 height=50>       <TABLE>         <TBODY>         <TR>           <TD></TD></TR></TBODY></TABLE></TD></TR>   <TR>     <TD width=50 bgColor=#000000 height=50>       <TABLE>         <TBODY>         <TR>           <TD></TD></TR></TBODY></TABLE></TD>     <TD width=50 bgColor=#000000 height=50>       <TABLE>         <TBODY>         <TR>           <TD></TD></TR></TBODY></TABLE></TD>     <TD width=50 bgColor=#000000 height=50>       <TABLE>         <TBODY>         <TR>           <TD></TD></TR></TBODY></TABLE></TD>     <TD width=50 bgColor=#000000 height=50>       <TABLE>         <TBODY>         <TR>           <TD></TD></TR></TBODY></TABLE></TD>     <TD width=50 bgColor=#000000 height=50>       <TABLE>         <TBODY>         <TR>           <TD></TD></TR></TBODY></TABLE></TD>     <TD width=50 bgColor=#000000 height=50>       <TABLE>         <TBODY>         <TR>           <TD></TD></TR></TBODY></TABLE></TD>     <TD width=50 bgColor=#000000 height=50>       <TABLE>         <TBODY>         <TR>           <TD></TD></TR></TBODY></TABLE></TD>     <TD width=50 bgColor=#000000 height=50>       <TABLE>         <TBODY>         <TR>           <TD></TD></TR></TBODY></TABLE></TD>     <TD width=50 bgColor=#000000 height=50>       <TABLE>         <TBODY>         <TR>           <TD></TD></TR></TBODY></TABLE></TD></TR></TBODY></TABLE>     <font face="verdana,arial,helvetica" size="2">     &nbsp;</font><div style="position: absolute; width: 285px; height: 293px; z-index: 1; left: 467px; top: 32px" id="layer1">     Click onto the red block with jump over it:          Move the red block avoiding crash with the blue ones          Don抰 touch the black edge.          If you can reach more than 18 seconds, you are a genius.               It is said that the pilots from the US Air Force         are forced to reach 2 MINUTES.</div> </BODY></HTML>

[Ctrl+A 全选注:引入外部Js需再刷新一下页面才能执行]

您可能感兴趣的文章:

JS获得鼠标位置（兼容多浏览器ie,firefox）脚本之家修正版
这段代码经过测试，支持ie和ff是个不错的代码，并修正了错误，希望大家先运行测试下
2008-11-11
JS代码简洁方式之函数方法详解
这篇文章主要介绍了JS代码简洁方式之函数方法详解，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧
2020-07-07
js中Function引用类型常见有用的方法和属性详解
在本篇文章里小编给大家整理的是关于js中Function引用类型常见有用的方法和属性知识点，有兴趣的朋友们可以学习下。
2019-12-12
JS增加行复制行删除行的实现代码
这篇文章介绍了JS增加行复制行删除行的实现代码，有需要的朋友可以参考一下
2013-11-11
JavaScript反弹动画效果的实现代码
本文通过实例代码给大家介绍了js反弹动画效果的实现代码，需要的朋友参考下吧
2017-07-07
form+iframe解决跨域上传文件的方法
下面小编就为大家带来一篇form+iframe解决跨域上传文件的方法。小编觉得挺不错的，现在就分享给大家，也给大家做个参考。一起跟随小编过来看看吧
2016-11-11
JavaScript变速动画函数封装添加任意多个属性
这篇文章主要介绍了JavaScript变速动画函数封装添加任意多个属性 ,非常不错，具有一定的参考借鉴价值，需要的朋友可以参考下
2019-04-04
一篇文章带你从零快速上手Rollup
这篇文章主要给大家介绍了如何通过一篇文章快速从零快速上手Rollup的相关资料，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧
2020-09-09
javascript css在IE和Firefox中区别分析
我们讨论的主题CSS网页布局，最令大家头疼的问题就是浏览器兼容性，虽然52CSS.com介绍过很多这方向的知识，但依然让很多开发人员晕头转向，今天的这篇文章，将列出css和javascript在IE和Firefox中二十三个不同点，希望对大家的学习有所帮助。
2009-02-02
JS在浏览器中存储用户名和密码的操作方法
当用户进行登录页后，直接从localStorage中把用户名和密码取出来，填充到表单里，对用户体验来说十分不错，今天通过本文给大家分享JS在浏览器中对用户名和密码进行存储,需要的朋友可以参考下
2023-06-06