Retro Text Animations In Pure JavaScript - textbanner.js
File Size: | 3.76 KB |
---|---|
Views Total: | 1724 |
Last Update: | |
Publish Date: | |
Official Website: | Go to website |
License: | MIT |
textbanner.js is a lightweight jQuery plugin that animates your text letter by letter with configurable animation speed and growth size just like the retro text banner effect.
Installation:
$ npm install textbanner
How to use it:
1. Just include the JavaScript file textbanner.js
after jQuery library and the textBanner plugin is ready for use.
<script src="//code.jquery.com/jquery.min.js"></script> <script src="textbanner.js"></script>
2. Wrap the text you want to animate in a container element with an unique ID.
<h1 id="demo">jQuery textbanner Demo</h1>
3. Animate the text with default options.
$('#demo').textbanner();
4. Specify how many times you want to cycle through the text animation.
$('#demo').textbanner({ cycles:3 });
5. Specify the animation speed.
$('#demo').textbanner({ // "slow", "intermediate", "fast", as well as numerical values speed: "intermediate" });
6. Set the growth size.
$('#demo').textbanner({ // default: 120 growth: 150 });
This awesome jQuery plugin is developed by michaeldfaber. For more Advanced Usages, please check the demo page or visit the official website.