This is one of the simplest possible games to start with. It's a recipe that combines events with animation. The output is as follows:
<html> <head> <title>Event Handling example</title> <script src="simplegame.js"></script> </head> <body onload=animate()> <h1>Score Area</h1> <canvas width="300" height="100" id="MyScoreArea" style="border:2px solid green;" tabindex="0"> Canvas tag is not supported by your browser </canvas> <br> <h1>click the yellow circle to score</h1> <canvas style="background-image:-webkit-canvas(mask);" width="800" height="500" id="MyCanvasArea" style="border:2px solid blue;" tabindex="0"> Canvas tag is not supported by your browser </canvas> </body> </html>
var can; var ctx; var isAnimating=true; var cd; var flag=1; var cd; var...