We've got an idea about what we are going to learn in the whole book in Chapter 1, Introducing HTML5 Games. From this chapter onwards, we will go through a lot of learning-by-doing sections, and we will focus on one topic in each section. Before digging deeply into the cutting-edge CSS3 animations and HTML5 Canvas game, let's start with traditional DOM-based game development. We will warm up with some basic techniques in this chapter.
In this chapter, we will be:
Setting up our first game—Ping Pong
Learning basic positioning with the jQuery JavaScript library
Getting mouse inputs
Creating the Ping Pong game that displays the scores
Learning to separate data and view rendering logic
We will create a Ping Pong game that a player plays against the computer via mouse input. You can try the game at http://makzan.net/html5-games/pingpong/.
The following screenshot shows the look of the game at the end of this chapter:
So, let's get on with making...