Moving Object Game Source Code

Javascript Tricks

Moving Object Game Source Code:

A game written in JavaScript. This script uses:

• The JavaScript function setTimeout to schedule a subroutine call a short time in the future.
• Button event handlers
• Text Input event handlers
• a DIV - to move an image around in the browser window.

 </script>
 
 <table  height="380" border="2" style="position: absolute; top:100; left:100">
   <tr>
    <td width="380" bgcolor="white"></td>
    <td bgcolor="cyan">
      <form id="frm">
        <p style="text-align:center">Move the cookie</p>
        <table align="center">
 
         <tr align="center">
           <td> </td>
           <td><input type="button" id="up"  value="up" onclick="move(0,-1)" 
              style="width:50; height:30; font-weight:bold;"  />
           </td>
           <td> </td>
         </tr>
 
         <tr align="center">
           <td><input type="button" id="left" value="left" onclick="move(-1,0)"
                style="width:50; height:30; font-weight:bold;"  />
           </td>
           <td> </td>
           <td><input type="button" id="right" value="right" onclick="move(1,0)"
              style="width:50; height:30; font-weight:bold;"  />
           </td>
         </tr>
 
         <tr align="center">
          <td></td>
          <td><input type="button" id="down" value="down" onclick="move(0,1)"
              style="width:50; height:30; font-weight:bold;"  />
          </td>
          <td></td>
         </tr>
        </table>
 
     <p style="text-align:center">
       <input type="button" id="jump" value="random jump" onclick="hjump()"
              style="width:100; height:30; font-weight:bold;"  />
     </p>
 
     <hr/>
     <p style="text-align:center">play the chase game</p>
 
     <p style="text-align:center">
       <input type="button" id="chase" value="start" onclick="hyperspace_game()"
              style="width:100; height:30; font-weight:bold;"  />
 
       <input type="button" id="chase" value="stop" onclick="stop_hyperspace_game()" 
              style="width:100; height:30; font-weight:bold;"  />
     </p>
 
 
     <p style="text-align:center">
       Speed: <input type="text" size="5" id="speed" /><br/>
       (msec. between jumps)
     </p>
 
     <hr/>
 
     <p style="text-align:center">
       Current Position:<br/>
       <input type="text" size="5" id="xcoord" onchange="setcoords()" />
       <input type="text" size="5" id="ycoord" onchange="setcoords()" />
     </p>
 
   </form>
 </td></tr></table>
 
 
 <div id="cookielayer" style="position: absolute; left:120; top:120">
 <img onclick="catchcookie();" src="cookie.gif"  border="0" width="100" height="100" />
 </div>
 
 <div style="height: 5.0in">
 </div>
 
 <script>
 
 // initialize the game speed
 document.forms["frm"].speed.value=500;
 updatecoords();
 
 </script>