<SCRIPT LANGUAGE="JavaScript"> <!-- Begin var blank_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 (blank_pos < 13) { count=blank_pos + 4; X = fun(count); Z = (parseInt(nam[X].top)); nam[X].top = Z - 52; Q = pos[X]; pos[X] = blank_pos; blank_pos = Q; } } else if (ieKey == 40) { if (blank_pos > 4) { count = blank_pos - 4; X = fun(count); Z = (parseInt(nam[X].top)); nam[X].top = Z + 52; Q = pos[X]; pos[X] = blank_pos; blank_pos = Q; } } else if (ieKey == 37) { r = blank_pos % 4 if (r == 0) { } else { count = blank_pos + 1; X = fun(count); Z = (parseInt(nam[X].left)); nam[X].left = Z - 52; Q = pos[X]; pos[X] = blank_pos; blank_pos = Q; } } else if (ieKey == 39) { ch = blank_pos + 3; r = ch % 4; if (r == 0) { } else { count = blank_pos - 1; X = fun(count); Z = (parseInt(nam[X].left)); nam[X].left = Z + 52; Q = pos[X]; pos[X] = blank_pos; blank_pos = Q; } } else { alert("PLEASE USE PROPER KEYS"); } A = false; b = 0; for (i = 1; i < 16; i++) { b++; if (pos[i] == b) { A = true; } else { A = false; break; } } if (A)alert("CONGRATULATIONS"); } function fun(count) { for (var i = 1; i < 16; i++) { if (pos[i] == count) { var X = i; } } return X; } // End --> </script>

<div ID="L8" STYLE="position:absolute; left:202px; top:302px; width:50px; height:50px; background-color:green;"> <br><b><center>8</center> </div> <div ID="L6" STYLE="position:absolute; left:254px;top:302px; width:50px; height:50px; background-color:green;"> <br><b><center>6</center> </div> <div ID="L13" STYLE="position:absolute; left:306px;top:302px; width:50px; height:50px; background-color:green;"> <br><b><center>13</center> </div> <div ID="L11" STYLE="position:absolute; left:358px;top:302px; width:50px; height:50px; background-color:green;"> <br><b><center>11</center> </div> <div ID="L10" STYLE="position:absolute; left:202px; top:354px; width:50px; height:50px; background-color:green;"> <br><b><center>10</center> </div> <div ID="L12" STYLE="position:absolute; left:254px;top:354px; width:50px; height:50px; background-color:green;"> <br><b><center>12</center> </div> <div ID="L1" STYLE="position:absolute; left:306px;top:354px; width:50px; height:50px; background-color:green;"> <br><b><center>1</center> </div> <div ID="L9" STYLE="position:absolute; left:358px;top:354px; width:50px; height:50px; background-color:green;"> <br><b><center>9</center> </div> <div ID="L4" STYLE="position:absolute; left:202px; top:406px; width:50px; height:50px; background-color:green;"> <br><b><center>4</center> </div> <div ID="L2" STYLE="position:absolute; left:254px;top:406px; width:50px; height:50px; background-color:green;"> <br><b><center>2</center> </div> <div ID="L14" STYLE="position:absolute; left:306px;top:406px; width:50px; height:50px; background-color:green;"> <br><b><center>14</center> </div> <div ID="L5" STYLE="position:absolute; left:358px;top:406px; width:50px; height:50px; background-color:green;"> <br><b><center>5</center> </div> <div ID="L7" STYLE="position:absolute; left:202px; top:458px; width:50px; height:50px; background-color:green;"> <br><b><center>7</center> </div> <div ID="L3" STYLE="position:absolute; left:254px;top:458px; width:50px; height:50px; background-color:green;"> <br><b><center>3</center> </div> <div ID="L15" STYLE="position:absolute; left:306px;top:458px; width:50px; height:50px; background-color:green;"> <br><b><center>15</center> </div>