Canvas
The final new feature that we want to cover here is the addition of the canvas element. Until HTML5, developers had no method to natively handle animation or interactivity. In other words, while tools like Flash allow us to create separate interactives and link or embed them in our pages, developers have long craved a way to build that interactive content right within the HTML code.
This single new element opens a whole world of possibility:
<canvas id=”newCanvas” width=”300” height=”150”></canvas>The canvas element essentially tells the browser to open a new blank canvas, in whatever size is specified through the width and height attributes. Then, you can place other code in between the opening and closing canvas tags to actually create that interactive content we talked about. The trick is in creating that “other” code.
Most developers are using JavaScript to create that interactivity. Take a look at some of the following demos to see some of the amazing things people are accomplishing in this fashion.
• True 8-bit Color Cycling with HTML5
www.effectgames.com/demos/canvascycle
• The Wilderness Downtown
www.thewildernessdowntown.com
• The Cloth Simulation
www.andrew-hoyer.com/andrewhoyer/experiments/cloth
Go Back - HTML5 - Part 1
No comments:
Post a Comment