Time for action – creating a game over dialog with the elapsed played time

We will continue with the code from the card matching game we made in Chapter 3, Building a Card-matching Game in CSS3. Carry out the following steps:

  1. Open the CSS3 matching game folder as our working directory.
  2. Download a background image from the following URL (we will use it as the background of the popup): http://mak.la/book-assets
  3. Place the image in the images folder.
  4. Open index.html in any text editor.
  5. We will need a font for the game over popup. Add the following font embedding CSS into the head section:
    <link href="http://fonts.googleapis.com/css?family=Orbitron:400,700" rel="stylesheet" type="text/css">
  6. Before the game section, we add a div named timer to show the elapsed ...

Get HTML5 Game Development by Example : Beginner's Guide - Second Edition now with the O’Reilly learning platform.

O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.