The push box game is a popular game many years ago (even now many people play it). The purpose of the game is very simple, that is, push the box and push all the boxes. When you reach the destination, the game is successful: it seems to be a simple logic, but in fact it is still difficult. I also relied on the help of others to complete it. Now I will introduce how to use js and html5 to write the game (for convenience, we will Replace it with a pink circle):
1. Ability requirements
JavaScript, HTML canvas, basic object-oriented ideas, reasonable programming logic.
2. Writing sequence
1.pushBox.html file
2.pojo.js file (used to store all objects)
3.paint.js file (used to write Drawing statements)
4.game.js file (used to write the running logic part)
5.allLevels.js file (used to store levels)
*Note: This is my writing habit. According to content and function, Each category is separated. If you have a better way to write it, please comment
3. Start writing
1. Create a basic pushBox .html file:
The content is very simple. The only needs the
<body> <canvas id='can1' width=1536 height=733></canvas> <audio id="walk" autoplay></audio> <audio id="push" autoplay></audio> <audio id="win" autoplay></audio> </body>