Here is an excellent way to animate your font with java script in your web 
applicatio nswith dat.gui a javascript library. Usage of this application library is very simple. Dat.gui is also providing minified version to make the script loads and work faster. It has very cool features like control panel with option to change the message, speed, explode, display outline etc
Usage is pretty simple in your application,
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 |
<script type='text/javascript' src='DAT.GUI.min.js'></script> <script type='text/javascript'> window.onload = function() { var fizzyText = new FizzyText('dat.gui'); var gui = new DAT.GUI(); // Text field gui.add(fizzyText, 'message'); // Sliders with min + max gui.add(fizzyText, 'maxSize').min(0.5).max(7); gui.add(fizzyText, 'growthSpeed').min(0.01).max(1).step(0.05); gui.add(fizzyText, 'speed', 0.1, 2, 0.05); // shorthand for min/max/step gui.add(fizzyText, 'noiseStrength', 10, 100, 5); // Boolean checkbox gui.add(fizzyText, 'displayOutline'); // Fires a function called 'explode' gui.add(fizzyText, 'explode').name('Explode!'); // Specify a custom name. }; </script> |
Requirement :- dat.gui library
Demo :- https://mydons.com/viewer/js/dat.gui/
Download :- https://97b5e8.n3cdn1.secureserver.net/download/75b5411e5c83ea7e9a8f9f80d0746f21/v0.4.zip
License :- License Free