HTML5 game tutorial - Make a snake game using HTML5 canvas and Jquery. Create Snake in JavaScript with HTML5 Canvas | UltraMega Tech. Yesterday I had some spare time, so I decided to write Snake in JavaScript using the HTML5 canvas. If anything, this is a good simple example demonstrating a use of the canvas. So, here's a tutorial walking through the creation of the game. If, for some reason, you are not familiar with the game Snake, Wikipedia explains it: The player controls a long, thin creature, resembling a snake, which roams around on a bordered plane, picking up food (or some other item), trying to avoid hitting its own tail or the "walls" that surround the playing area. Here is the final product on jsFiddle (click Result to play): This tutorial will cover: Drawing on the canvasHandling events in jQueryHandling arrays in JavaScriptJavaScript math functions We'll start with the HTML, which simply needs to include jQuery and a canvas element with ID of c.
Variables Now we can start our code with some variables: So what are all these variables about? Setup We need a function to set some variables and set up everything. Le snake [ Scripts à copier/coller ] Insertion d'une image dans mon jeu snake.