Tiny Text Typing & Deleting Effects Library – Typed.js

Preview:

Description:

Typed.js is a small JavaScript library that loops through a series of strings with typewriter-like typing & deleting effects.

How to use it:

1. Import the Typed.js library.

import Typed from "./typed.js";

2. Initialize the Typed on the target element and define an array of strings to be printed on the screen.

<span class="example"></span>

const auto = new Typed('.example', {
      strings: ['String 1', 'String 2', 'String 3'],
});

3. Config the animation speed.

const auto = new Typed('.example', {
      strings: ['String 1', 'String 2', 'String 3'],
      typeSpeed: 1,
      backSpeed: 1,
});

4. Determine whether to loop the typing & deleting effects. Default: false.

const auto = new Typed('.example', {
      strings: ['String 1', 'String 2', 'String 3'],
      loop: true,
});

5. Customize the color of the blinking cursor. Default: ‘black’.

const auto = new Typed('.example', {
      strings: ['String 1', 'String 2', 'String 3'],
      IPColor: 'white',
});