Simple Text Typing Animation with jQuery - Typed Text

Simple Text Typing Animation with jQuery - Typed Text
File Size: 9.45 KB
Views Total:
Last Update:
Publish Date:
Official Website: Go to website
License: MIT
   

Just another jQuery text animation plugin that presents your text letter by letter at a specific speed to simulate the typewriter typing effect.

Basic usage:

1. To get started, you need to include the jQuery Typed Text plugin after jQuery JavaScript library.

<script src="//code.jquery.com/jquery-1.11.3.min.js"></script>
<script src="src/jquery.typedtext.js"></script>

2. Create an empty element that will display the text we want to animate with the typing effect.

<div id="demo"></div>

3. Call the function on the element and specify the text we want to animate. The second parameter could either be a string (Possible values: slow, medium, fast), an integer, or it could be left blank and in that case the amount of milliseconds that will pass before typing the upcoming letter will be 66.

$("#demo").typedText("Text To Animate.", "slow");

4. Execute a cllback upon successful completion of the text animation

$("#demo").typedText("Text To Animate.", "slow",function() {
  alert("Successful Message");
);

Change log:

2015-10-27

  • Added another way of implementing the plugin.

2015-10-24

  • Fix parsing 'space' argument

2015-10-03

  • Added callback function

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