Simulate The Typing Effect in Minutes with TypeWriter.js

Category: Animation , Javascript , Text | February 9, 2023
Author:vishwas-r
Views Total:274 views
Official Page:Go to website
Last Update:February 9, 2023
License:MIT

Preview:

Simulate The Typing Effect in Minutes with TypeWriter.js

Description:

Just another typewriter-like typing effect library that allows you to easily animate text so that characters look like they’re being typed on your web page.

How to use it:

1. Download and import the TypeWriter.js library.

<script src="typewriter.min.js"></script>

2. Create a new TypeWriter instance.

<h1 id="typewriter"></h1>
var typewriter = new TypeWriter("typewriter", {
    // options here
});

3. Define the text to be typed on the page.

var typewriter = new TypeWriter("typewriter", {
    strings: ["TypeWriter.js", "Typing Animation", "Simple And Easy To Use"],
});

4. Start the typing animation.

typewriter.start();

5. Config the typing animation.

var typewriter = new TypeWriter("typewriter", {
    strings: ["TypeWriter.js", "Typing Animation", "Simple And Easy To Use"],
    speed: 500,
    delay: 300,
});

6. Determine whether to loop the animation. Default: true.

var typewriter = new TypeWriter("typewriter", {
    strings: ["TypeWriter.js", "Typing Animation", "Simple And Easy To Use"],
    loop: false,
});

7. Customize the cursor displayed at the end of the text while typing.

var typewriter = new TypeWriter("typewriter", {
    strings: ["TypeWriter.js", "Typing Animation", "Simple And Easy To Use"],
    cursor: "..."
});

You Might Be Interested In:


Leave a Reply