Animating text
It gives immense pleasure when you see your name on a screen. And it looks much better when animated. After learning this recipe, try your name.
You have seen the animation of a shape. The new recipe shows the animation of some text. The output is shown here:
How to do it…
This recipe is very similar to the code shown in the first recipe.
The HTML code:
<html> <head> <title>Animated Text</title> <script src="TextAnim.js"></script> </head> <body onload="init();"> <canvas id="MyCanvasArea" width="400" height="400" style="border:2px solid blue;" > your browser does not support canvas </canvas> <h1>An Animated Text</h1> </body> </html>
The JavaScript code:
var can;
var ctx;
var alpha=0.0;
var goUp=true;
function animate() {
reqAnimFrame = window.mozRequestAnimationFrame ||
window.webkitRequestAnimationFrame ||
window.msRequestAnimationFrame ||
...
