In this task, we would like to define an essential game object—tiles. We use tiles to construct the running floor, and the types of tiles include the runway terrain and obstacles.
We will put our code in several places. Make sure that you have the following files ready before you start:
setting.jstile.jsplayer.js
First, let's put the game objects inside the game scene in the HTML file. There is an element that represents the floor, an element that represents the player, and a few temporary elements that represent the tiles, these are given in more detail in the following steps:
The tile elements come with an inline style for placement on the floor:
<div id="game-scene" class="scene"> <div id="floor" class="floor"> <div id="player"></div> <!-- temporary code to be removed in next task --> <div class='tile tile-1' style='transform: translate3d(100px, 0, 0)'>...