Creating Simple Text Animations with jQuery FunnyText Plugin
File Size: | 158KB |
---|---|
Views Total: | 2176 |
Last Update: | |
Publish Date: | |
Official Website: | Go to website |
License: | MIT |

funnyText is a lightweight (~3kb minified) jQuery plugin that makes use of javascript and CSS3 transitions to create random text animations like moving, flipping, etc.
See also:
- jQuery Plugin For Split Flap Text Animation - Flapper
- jQuery Text Animation Plugin with CSS3 - textillate
- Text Animation Effect with jQuery - animateText.js
Basic Usage:
1. Load the required jQuery funnyText CSS file in the head section of your document.
<link rel="stylesheet" type="text/css" href="./jquery.funnyText.css" />
2. Create some text on your page.
<div class="demo"> jQueryScript.Net </div>
3. Load the jQuery library and jQuery funnyText plugin at the bottom of your document.
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script> <script type="text/javascript" src="./jquery.funnyText.js"></script>
4. Call the plugin with animation options.
<script type="text/javascript"> $(document).ready(function() { $('.demo').funnyText({ speed: 700, // the speed of your text animation. borderColor: 'black', // the border color of your characters. activeColor: '#fff', // the text color when the animation is active. color: 'black', // the default color of your text. fontSize: '8em' // the font size of your text. }); }); </script>
This awesome jQuery plugin is developed by alvarotrigo. For more Advanced Usages, please check the demo page or visit the official website.