_Synk_
05-26-2003, 02:13 PM
Hello guys,
I'm trying to make a tetris style game, but I can't figure out how to make the arrow keys work. I tried using keycodes 37-40, but they didn't work. I've only worked on this a couple of hours, and I'm not a professional programmer, either, so don't expect much of my code to be very good :rolleyes: however, here's what I do have:
<html><head><title>My Game</title></head>
<body onload="gamestart()" text="white" bgcolor="black" height=100% width=100% marginwidth=0 marginheight=0 leftmargin=0 topmargin=0 rightmargin=0 bottommargin=0>
<table border=0 cellpadding=0 cellspacing=0 height=100% width=100% marginwidth=0 marginheight=0 leftmargin=0 topmargin=0 rightmargin=0 bottommargin=0>
<tr><td valign="top" height="165" width="140">
<font size="+2"><br><b>Score:</b> <span ID="score">00000</span></font></td>
<td valign="top" rowspan=3><table border=3 style="border-right: 0px;border-top: 0px;border-bottom: 0px;" cellpadding=0 cellspacing=0 height=100% width=100%>
<tr><td> </td></tr></table></td></tr><tr>
<td height="166" valign="top"><font size="+2"><b><font color="yellow">Level:</font></b> <span ID="level">1</span></font></td></tr>
<tr><td valign="top"><font size="+2"><b><font color="red">Rank:</font></b><br> <span ID="rank" style="color:green">Beginner</span><br>
<span ID="rank2">Builder</span><br> <span ID="rank3">Engineer</span></font></td>
</tr></table><div ID='title' style='position:absolute;top:200px;right:100px;color:yellow;'><font size='+6'>Falling<br>Blocks!</font></div><!--Now for the core of the game--Java Script! sigh-->
<script language="JavaScript">
<!--var game= "inactive";
var offon = 0;var offon2=0;
/*document.body.insertAdjacentHTML("BeforeEnd","<div ID='block' style='position:absolute;top:1;left:144'><table border=0 height=25px width=25px cellpadding=0 cellspacing=0 bgcolor=red><tr><td></td></tr></table></div>");var i=2;var j=169;var k=0;while (i != 20){if(k==0){document.body.insertAdjacentHTML("BeforeEnd","<div ID='block' style='position:absolute;top:1;left:"+j+"'><table border=0 height=25px width=25px cellpadding=0 cellspacing=0 bgcolor='white'><tr><td></td></tr></table></div>");k++;j=j+25;}else {document.body.insertAdjacentHTML("BeforeEnd","<div ID='block' style='position:absolute;top:1;left:"+j+"'><table border=0 height=25px width=25px cellpadding=0 cellspacing=0 bgcolor='red'><tr><td></td></tr></table></div>");k=0;j=j+25;}i++}*/
function gamestart(){
if(offon == 0){
title.style.color = "white";offon=1;}
else{
title.style.color = "yellow";offon=0;}
if(offon2<15){setTimeout("gamestart()",200);}
offon2++;}
function checkCR(evt) {
var evt = (evt) ? evt : ((event) ? event : null);
var node = (evt.target) ? evt.target : ((evt.srcElement) ? evt.srcElement : null);
if ((evt.keyCode == 13)) {title.innerHTML="";gamestart2();}
if (game == "started"){
if (parseInt(blocks.style.top)<474){
if ((evt.keyCode == 97)) {if(parseInt(blocks.style.left)>156){blocks.style.left=parseInt(blocks.style.left)-25;}}
if ((evt.keyCode == 100)) {if(parseInt(blocks.style.left)<425){blocks.style.left=parseInt(blocks.style.left)+25;}}
}
else{doit();}
}
}
document.onkeypress = checkCR;
function gamestart2(){game = "started";
var rannum=1;
img = new Array();
img[1] = "gray.gif"
img[2] = "blue.gif"
img[3] = "red.gif"
var gamearea=144;
var distance=gamearea+150;
var block="<div ID='blocks' style='position:absolute;top:1;left:"+distance+"'><table border=0 height=25px width=25px cellpadding=0 cellspacing=0><tr><td><img src='"+img[rannum]+"'</td></tr></table></div>";
document.body.insertAdjacentHTML("BeforeEnd",""+block);
movedown()}
function movedown(){if(parseInt(blocks.style.top)<=474){
blocks.style.top=parseInt(blocks.style.top)+2;
setTimeout("movedown()",40);}}
function doit(){
setTimeout("gamestart2()",1000);}
-->
</script>
</body></html>
I'm a new programmer, so, any extra help would be nice :)
I'm trying to make a tetris style game, but I can't figure out how to make the arrow keys work. I tried using keycodes 37-40, but they didn't work. I've only worked on this a couple of hours, and I'm not a professional programmer, either, so don't expect much of my code to be very good :rolleyes: however, here's what I do have:
<html><head><title>My Game</title></head>
<body onload="gamestart()" text="white" bgcolor="black" height=100% width=100% marginwidth=0 marginheight=0 leftmargin=0 topmargin=0 rightmargin=0 bottommargin=0>
<table border=0 cellpadding=0 cellspacing=0 height=100% width=100% marginwidth=0 marginheight=0 leftmargin=0 topmargin=0 rightmargin=0 bottommargin=0>
<tr><td valign="top" height="165" width="140">
<font size="+2"><br><b>Score:</b> <span ID="score">00000</span></font></td>
<td valign="top" rowspan=3><table border=3 style="border-right: 0px;border-top: 0px;border-bottom: 0px;" cellpadding=0 cellspacing=0 height=100% width=100%>
<tr><td> </td></tr></table></td></tr><tr>
<td height="166" valign="top"><font size="+2"><b><font color="yellow">Level:</font></b> <span ID="level">1</span></font></td></tr>
<tr><td valign="top"><font size="+2"><b><font color="red">Rank:</font></b><br> <span ID="rank" style="color:green">Beginner</span><br>
<span ID="rank2">Builder</span><br> <span ID="rank3">Engineer</span></font></td>
</tr></table><div ID='title' style='position:absolute;top:200px;right:100px;color:yellow;'><font size='+6'>Falling<br>Blocks!</font></div><!--Now for the core of the game--Java Script! sigh-->
<script language="JavaScript">
<!--var game= "inactive";
var offon = 0;var offon2=0;
/*document.body.insertAdjacentHTML("BeforeEnd","<div ID='block' style='position:absolute;top:1;left:144'><table border=0 height=25px width=25px cellpadding=0 cellspacing=0 bgcolor=red><tr><td></td></tr></table></div>");var i=2;var j=169;var k=0;while (i != 20){if(k==0){document.body.insertAdjacentHTML("BeforeEnd","<div ID='block' style='position:absolute;top:1;left:"+j+"'><table border=0 height=25px width=25px cellpadding=0 cellspacing=0 bgcolor='white'><tr><td></td></tr></table></div>");k++;j=j+25;}else {document.body.insertAdjacentHTML("BeforeEnd","<div ID='block' style='position:absolute;top:1;left:"+j+"'><table border=0 height=25px width=25px cellpadding=0 cellspacing=0 bgcolor='red'><tr><td></td></tr></table></div>");k=0;j=j+25;}i++}*/
function gamestart(){
if(offon == 0){
title.style.color = "white";offon=1;}
else{
title.style.color = "yellow";offon=0;}
if(offon2<15){setTimeout("gamestart()",200);}
offon2++;}
function checkCR(evt) {
var evt = (evt) ? evt : ((event) ? event : null);
var node = (evt.target) ? evt.target : ((evt.srcElement) ? evt.srcElement : null);
if ((evt.keyCode == 13)) {title.innerHTML="";gamestart2();}
if (game == "started"){
if (parseInt(blocks.style.top)<474){
if ((evt.keyCode == 97)) {if(parseInt(blocks.style.left)>156){blocks.style.left=parseInt(blocks.style.left)-25;}}
if ((evt.keyCode == 100)) {if(parseInt(blocks.style.left)<425){blocks.style.left=parseInt(blocks.style.left)+25;}}
}
else{doit();}
}
}
document.onkeypress = checkCR;
function gamestart2(){game = "started";
var rannum=1;
img = new Array();
img[1] = "gray.gif"
img[2] = "blue.gif"
img[3] = "red.gif"
var gamearea=144;
var distance=gamearea+150;
var block="<div ID='blocks' style='position:absolute;top:1;left:"+distance+"'><table border=0 height=25px width=25px cellpadding=0 cellspacing=0><tr><td><img src='"+img[rannum]+"'</td></tr></table></div>";
document.body.insertAdjacentHTML("BeforeEnd",""+block);
movedown()}
function movedown(){if(parseInt(blocks.style.top)<=474){
blocks.style.top=parseInt(blocks.style.top)+2;
setTimeout("movedown()",40);}}
function doit(){
setTimeout("gamestart2()",1000);}
-->
</script>
</body></html>
I'm a new programmer, so, any extra help would be nice :)