Creating A Text Typewriter Effect with jQuery TypeOut Plugin

TypeOut is a super lightweight jQuery plugin imitates typewriter typing effect for creating animated text that appears 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:

• Animated Typewriter Effect with jQuery - typer.js
• jQuery Plugin for Vintage Text Typing - jqVintageTxt
• Simple Text Typing Effect with jQuery

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.

$(function(){
  $('.demo1').typeOut(); 
});

4. Custom options.

$('.demo1').typeOut({

  // the delay between display of characters
  delay : 90, 

  // Maintains HTML within the element
  preserve : false, 

  // the marker that is placed before the typed text
  marker : '_' 
  
}); 

---

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