Author: | yat529 |
---|---|
Views Total: | 3,005 views |
Official Page: | Go to website |
Last Update: | January 3, 2018 |
License: | MIT |
Preview:

Description:
typing.js is a vanilla JavaScript plugin used to simulate Typewriter typing and erasing effects on the screen. Supports multi-line text typing and custom font styles.
How to use it:
Insert the typing.css
and typing.js
into the document.
<link rel="stylesheet" href="typing.css"> <script src="typing.js"></script>
Create a container in which you want to output the text.
<div id="demo"></div>
Initialize the typing.js and we’re ready to go.
- selector: target container.
- speed: typing speed in milliseconds.
- initialdelay: initial delay in milliseconds.
// selector, speed, initialDelay _$("demo", 100, 800)
API.
- type(string, option): type strings
- wait(): time before typing
- speed(): typing speed
- lineBreak(): add a linebreak
- delete(string, option): delete strings
_$("demo", 100, 800) .type("Hello! ").wait(1000).speed(100) .type("This is ").wait(300).speed(100) .lineBreak() .type("Typing Javascript", { fontWeight: "bold", color: "black", }).speed(40) .delete("Javascript").wait(1000).speed(200) .type("JS", { fontWeight: "bold", color: "black", }).wait(1000) .lineBreak();