Creating A Text Typewriter Effect with jQuery TypeOut Plugin

Creating A Text Typewriter Effect with jQuery TypeOut Plugin
File Size: 10.8KB
Views Total:
Last Update:
Publish Date:
Official Website: Go to website
License: MIT
   

TypeOut is a super lightweight jQuery plugin imitates typewriter typing effect for creating animated text that appear like it is being typed like with a typewriter. You can customize the animation delay and marker character in the javascript to suit your own needs.

See also:

Basic Usage:

1. Create the text you want to apply the typing animation on.

<p class='demo1'>jQueryScript.net is a jQuery plugin website.</p>

2. Include the latest jQuery library and jQuery typeout plugin at the bottom of your document.

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script src="jquery.typeout.js"></script>

3. Call the plugin and you're done.

<script>
$('.demo1').typeOut(); 
</script>

4. Custom options.

<script>
$('.demo1').typeOut({
delay : 90, // the delay between display of characters
preserve : false, // Maintains HTML within the element
marker : '_' // the marker that is placed before the typed text
}); 
</script>

This awesome jQuery plugin is developed by darcyclarke. For more Advanced Usages, please check the demo page or visit the official website.