animate-text-content.js

This JS micro-library allows you to animate the text content of elements in the DOM. It employs the method chaining pattern to construct a timeline of sequential animations.

See documentation here.

Example

To start, you create a Timeline object by calling atc, passing in an DOM element node or selector string:

HTML

    <div id="exampleDiv"></div>

JS

    var timeline = atc("#exampleDiv");

Then, you construct a series of animations, which are placed in a queue in the order they are given.

    timeline
      .typeIn("I like to eat ")
      .html("I like to eat <span id='fruit'></span>")
      .switchElement("#fruit")
      .typeIn("apples")
      .pause()
      .erase()
      .typeIn("bananas")
      .pause()
      .erase()
      .typeIn("oranges");

When you want the animations to play, you use .go().

    timeline.go();

Caution

Current build state is incomplete. Bugs are likely.