typewriting

TypeWriting.js

GitHub repo / DEMO

Note: TypeWriting.js doesn't depend on jQuery since version 1.2. If you want to keep the old version, please check another branch - jQuery-v1.1.3.

---

Setup

<!-- just typewriting.js or .min.js -->
<script type="text/javascript" src="path/to/typewriting.min.js"></script>

or

// import in your .js file
import TypeWriting from 'typewriting';

I use the height of targetElement to set the cursor height. You could use its line-height to control cursor height.

---

TypeWriting()

• targetElement: HTML element required
  Your element
• inputString: String required
  Your text
• typing_interval: Int
  Interval between each character
• blink_interval: String
  Interval of the cursor blinks
• cursor_color: String
  Color of the cursor

Second parameter is the function after typing effect.

var typeWriting = new TypeWriting({
	targetElement	: document.getElementsByClassName('terminal')[0],
	inputString		: 'Hello, world.',
	typing_interval	: 130,
	blink_interval	: '1s',
	cursor_color	: '#00fd55',
}, function() {
	console.log("END");
});

rewrite()

You could use this function to do the same effect but different text at same element.

typeWriting.rewrite( "This is TypeWriting.js", function() {
	console.log("Rewrite is finished");
});

---

Author

Eddie Wen: [e-mail]
GitHub: https://github.com/EddieWen-Taiwan