<script language="JavaScript">
<!--
var b_pos = 16,
count = 0,
pos = new Array(),
nam = new Array();
pos[1] = 7;
pos[2] = 10;
pos[3] = 14;
pos[4] = 9;
pos[5] = 12;
pos[6] = 2;
pos[7] = 13;
pos[8] = 1;
pos[9] = 8;
pos[10] = 5;
pos[11] = 4;
pos[12] = 6;
pos[13] = 3;
pos[14] = 11;
pos[15] = 15;
function start() {
nam[1] = L1.style;
nam[2] = L2.style;
nam[3] = L3.style;
nam[4] = L4.style;
nam[5] = L5.style;
nam[6] = L6.style;
nam[7] = L7.style;
nam[8] = L8.style;
nam[9] = L9.style;
nam[10] = L10.style;
nam[11] = L11.style;
nam[12] = L12.style;
nam[13] = L13.style;
nam[14] = L14.style;
nam[15] = L15.style;
document.onkeydown = keyDown;
}
function keyDown() {
var ieKey = event.keyCode;
if (ieKey == 38) {
if (b_pos < 13) {
count=b_pos + 4;
X = fun(count);
Z = (parseInt(nam[X].top));
nam[X].top = Z - 52;
Q = pos[X];
pos[X] = b_pos;
b_pos = Q;
}
}
else if (ieKey == 40) {
if (b_pos > 4) {
count = b_pos - 4;
X = fun(count);
Z = (parseInt(nam[X].top));
nam[X].top = Z + 52;
Q = pos[X];
pos[X] = b_pos;
b_pos = Q;
}
}
else if (ieKey == 37) {
r = b_pos % 4
if (r == 0) {
}
else {
count = b_pos + 1;
X = fun(count);
Z = (parseInt(nam[X].left));
nam[X].left = Z - 52;
Q = pos[X];
pos[X] = b_pos;
b_pos = Q;
}
}
else if (ieKey == 39) {
ch = b_pos + 3;
r = ch % 4;
if (r == 0) {
}
else {
count = b_pos - 1;
X = fun(count);
Z = (parseInt(nam[X].left));
nam[X].left = Z + 52;
Q = pos[X];
pos[X] = b_pos;
b_pos = Q;
}
}
else {
alert("禁止使用其它按键！");
}
A = false;
b = 0;
for (i = 1; i < 16; i++) {
b++;
if (pos[i] == b) {
A = true;
}
else {
A = false;
break;
}
}
if (A)alert("恭喜你，您已过关！");
}
function fun(count) {
for (var i = 1; i < 16; i++) {
if (pos[i] == count) {
var X = i;
}
}
return X;
}
//-->
</script>
</head>
<body onLoad="start()">
<center><div ID="L8" STYLE="position:absolute; left:50px; top:50px; width:50px; height:50px; background-color:blue;">
<br><b><center><font color=white>8</center>
</div>
<div ID="L6" STYLE="position:absolute; left:102px;top:50px; width:50px; height:50px; background-color:blue;">
<br><b><center>6</center>
</div>
<div ID="L13" STYLE="position:absolute; left:154px;top:50px; width:50px; height:50px; background-color:blue;">
<br><b><center>13</center>
</div>
<div ID="L11" STYLE="position:absolute; left:206px;top:50px; width:50px; height:50px; background-color:blue;">
<br><b><center>11</center>
</div>
<div ID="L10" STYLE="position:absolute; left:50px; top:102px; width:50px; height:50px; background-color:blue;">
<br><b><center>10</center>
</div>
<div ID="L12" STYLE="position:absolute; left:102px;top:102px; width:50px; height:50px; background-color:blue;">
<br><b><center>12</center>
</div>
<div ID="L1" STYLE="position:absolute; left:154px;top:102px; width:50px; height:50px; background-color:blue;">
<br><b><center>1</center>
</div>
<div ID="L9" STYLE="position:absolute; left:206px;top:102px; width:50px; height:50px; background-color:blue;">
<br><b><center>9</center>
</div>
<div ID="L4" STYLE="position:absolute; left:50px; top:154px; width:50px; height:50px; background-color:blue;">
<br><b><center>4</center>
</div>
<div ID="L2" STYLE="position:absolute; left:102px;top:154px; width:50px; height:50px; background-color:blue;">
<br><b><center>2</center>
</div>
<div ID="L14" STYLE="position:absolute; left:154px;top:154px; width:50px; height:50px; background-color:blue;">
<br><b><center>14</center>
</div>
<div ID="L5" STYLE="position:absolute; left:206px;top:154px; width:50px; height:50px; background-color:blue;">
<br><b><center>5</center>
</div>
<div ID="L7" STYLE="position:absolute; left:50px; top:206px; width:50px; height:50px; background-color:blue;">
<br><b><center>7</center>
</div>
<div ID="L3" STYLE="position:absolute; left:102px;top:206px; width:50px; height:50px; background-color:blue;">
<br><b><center>3</center>
</div>
<div ID="L15" STYLE="position:absolute; left:154px;top:206px; width:50px; height:50px; background-color:blue;">
<br><b><center>15</font></center>
</div></center>
<table STYLE="position:absolute; left:280px;top:50px;">
<tr align=center>
<td width=40 height=40 bgcolor="#0000ff"><font color="#ffffff">1</td>
<td width=40 height=40 bgcolor="#0000ff"><font color="#ffffff">2</td>
<td width=40 height=40 bgcolor="#0000ff"><font color="#ffffff">3</td>
<td width=40 height=40 bgcolor="#0000ff"><font color="#ffffff">4</td>
</tr>
<tr align=center>
<td width=40 height=40 bgcolor="#0000ff"><font color="#ffffff">5</td>
<td width=40 height=40 bgcolor="#0000ff"><font color="#ffffff">6</td>
<td width=40 height=40 bgcolor="#0000ff"><font color="#ffffff">7</td>
<td width=40 height=40 bgcolor="#0000ff"><font color="#ffffff">8</td>
</tr>
<tr align=center>
<td width=40 height=40 bgcolor="#0000ff"><font color="#ffffff">9</td>
<td width=40 height=40 bgcolor="#0000ff"><font color="#ffffff">10</td>
<td width=40 height=40 bgcolor="#0000ff"><font color="#ffffff">11</td>
<td width=40 height=40 bgcolor="#0000ff"><font color="#ffffff">12</td>
</tr>
<tr align=center>
<td width=40 height=40 bgcolor="#0000ff"><font color="#ffffff">13</td>
<td width=40 height=40 bgcolor="#0000ff"><font color="#ffffff">14</td>
<td width=40 height=40 bgcolor="#0000ff"><font color="#ffffff">15</td>
<td width=40 height=40></td>
</tr>
</table>