»
EnglishFrenchVietnamese

Print - Box Puzzle - JavaScriptBank.com

Full version: jsB@nk » Game » Puzzle » Box Puzzle
URL: https://www.javascriptbank.com/box-puzzle.html

Box Puzzle © JavaScriptBank.com(Internet Explorer Only) Move the squares using the arrow keys to get them in the correct order. Fun!

Full version: jsB@nk » Game » Puzzle » Box Puzzle
URL: https://www.javascriptbank.com/box-puzzle.html



JavaScript
<SCRIPT LANGUAGE="JavaScript">// John Chacko (johns221b@yahoo.com)<!-- Beginvar 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 % 4if (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><!--    This script downloaded from www.JavaScriptBank.com    Come to view and download over 2000+ free javascript at www.JavaScriptBank.com-->


HTML
<BODY onLoad="start()"><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></body><!--    This script downloaded from www.JavaScriptBank.com    Come to view and download over 2000+ free javascript at www.JavaScriptBank.com-->