decode
decode()
The decode is a complicated animation function, yet it retains the low overhead model employed in typewriter().
Usage
Animate the provided text into the target.
1 | $('#target_div_id').decode({text: 'Text to animate'); |
The above will take the provided text and provide an animation over 3 seconds, plus 150ms for every character in the text provided.
3 seconds will provide a pure random string animation, then every subsequent 150ms one real character of the string will be revealed.
Example 1
Source
1 2 3 4 5 | <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.2.6/jquery.min.js"></script><br /> <script src="http://svn.saiweb.co.uk/branches/jquery_plugin/tags/0.3/jquery.saiweb.min.js" type="text/javascript"></script><br /> <a name="decode"></a> <div id='decode_div_id'></div> <a href="#decode" onclick="$('#decode_div_id').decode({text: 'As you can see this text is being animated as if it is decoding'});">decode()</a> |
Advanced
1 2 3 4 5 | $('#decode_div_id').decode({ delay: 150, duration: 0, text: 'This is some replacement text' }); |
All the options above can be using singularly or together, however you must at least define some text to animate.
- delay: the time in milliseconds between animation
- duration: The duration in milliseconds of the initial random text animation
- text: The real text to be used in the animation
1 2 3 | $('#decode_div_id').decode({delay: 150}); $('#decode_div_id').decode({duration: 3000}); $('#decode_div_id').decode({text: 'This is some replacement text'}); |
NOTE: If you have firebug installed you can try all these examples in the page.
Entries (RSS)
Now this is insanely awesome!! An effect I will surely employ in future to spice up boring text ^_^
10/10