HTML and CSS Reference
In-Depth Information
Figure 13-2:
The final game (shown on an iPad).
With a few hundred lines of code, you've now built the backbone of a nethack-style CSS3-based RPG, as
shown in
Figure 13-2
.
There are a lot of features that can still be added to fill out the functionality, including
enemy movement, different strengths and rewards from enemies, random levels and pathfinding, inventory, and
all the other trappings of a good nethack-style RPG. If you want to keep hacking on it, the code is open source
under the MIT license and on GitHub.
Summary
In this chapter you built a game using CSS and DOM elements. There are more CSS3 features such as anim-
ations and 3-D transforms that haven't been covered that could fill another book. If you are looking for more
things that you can do in CSS3, check out some of the resources in the bibliography. Although the new CSS3
features are neat, with hardware-accelerated canvas appearing on more and more devices and browsers, one of
the primary advantages of CSS is its backward compatibility, so building a game from the ground up that relies
on cutting-edge CSS features might not be the best idea. This chapter showed you how to build a game that
works all the way back to IE6 on the desktop, whereas still providing a nice smooth-animated experience for
newer desktop and mobile browsers.
