box.htm:
<!doctype html public "-//w3c//dtd html 4.0 transitional//en">
<html>
<head>
<title>推箱子游戏</title>
<meta name="generator" content="editplus">
<meta name="author" content="dolphin">
<meta name="keywords" content="推箱子,搬运工,box">
<meta name="description" content="推箱子游戏">
<style type="text/css">
<!--
.ground{background-color: #007300}
.wall{border:1px outset #cccccc;background-color:#cccccc;z-index:0;background: url(wall.bmp)}
.aim{background-color:#ffffff;filter:alpha(opacity=100,finishopacity=5,style=3);z-index:0}
.box{background-color:#ffffff;filter:alpha(opacity=5,finishopacity=100,style=3);z-index:1}
.man{background-color:red;z-index:1;filter:filpv}
td{font-size:12px;}
// -->
</style>
<script language="javascript" src="level_dat.js"></script>
<script language="javascript" src="box.js"></script>
</head>
<body>
<table width="80%" align=center>
<tr>
<td valign=top>
箱子移动:<input id=boxmoveinfo readonly size=5> 步<br>
人 移 动:<input id=manmoveinfo readonly size=5> 步<br>
当前关数:<input id=levelinfo readonly size=5> 关
<p>
<input type=button value='撤销移动' onclick='undo()'><br><br>
<input type=button value='重复移动' onclick='redo()'><br><br>
<input type=button value='读取进度' onclick='loadlevel()'><br><br>
<input type=button value='保存进度' onclick='savelevel()'><br><br>
<input type=button value='选择关数' onclick='customlevel()'><br><br>
</p>
<textarea id=info rows=20 style="display:none"></textarea>
</td>
<td valign=top><span id=base style='position:absolute;overflow:hidden'></span></td>
</tr>
</table>
</body>
</html>
box.js:
var uselevel = 0;
function window.onload(){
//uselevel = getcookie("level");
readmap(uselevel);
document.body.scroll='no';
function document.onkeydown(){
switch(event.keycode){
case 37:dir(-1,0,'l');break;//left
case 38:dir(0,-1,'u');break;//up
case 39:dir(1,0,'r');break;//right
case 40:dir(0,1,'d');break;//down
}
event.returnvalue = false;
info.value = backrecord.join("");
iselects(count);
}
function document.oncontextmenu(){
event.returnvalue = false;
}
window.focus();
base.focus();
}
function readmap(level){
init();
base.innerhtml = '';
var w=map[level][0].length*mapw
var h=map[level].length*mapw
base.style.width = w;
base.style.height = h;
base.style.left = (w>document.body.clientwidth)?0:(document.body.offsetwidth-w)/2;
//base.style.top = 10;
for(var y=0;y<map[level].length;y++){
mainmap[y] = [];
for(var x=0;x<map[level][y].length;x++){
mainmap[y][x] = map[level][y].charat(x);
if(mainmap[y][x]=='w') ihtml(x,y,'wall');
else{
ihtml(x,y,'ground');
switch(mainmap[y][x]){
case '0':ibox(x,y,0);break;
case '.':ihtml(x,y,'aim');break;
case '@':ihtml(x,y,'aim');ibox(x,y,1);boxcompletes++;break;
case '*':iman(x,y,0);break;
case '#':ihtml(x,y,'aim');iman(x,y,1);break;
}
}
}
}
}
function ihtml(x,y,k){
base.insertadjacenthtml("beforeend","<span style='position:absolute;left:"+x*mapw+";top:"+y*maph+";width:"+mapw+";height:"+maph+"' class='"+k+"' x="+x+" y="+y+">");
}
function ibox(x,y,k){
mainmap[y][x] = base.appendchild(document.createelement("<span style='position:absolute;left:"+x*mapw+";top:"+y*maph+";width:"+mapw+";height:"+maph+"' class='box' complete='"+k+"'>"));
totalbox++;
}
function iman(x,y,k){
man = base.appendchild(document.createelement("<img alt='man' src='boxman.bmp' style='position:absolute;left:"+x*mapw+";top:"+y*maph+";width:"+mapw+";height:"+maph+";' class='man'>"));