Skip to content

Instantly share code, notes, and snippets.

@thoriqmacto
Last active January 15, 2017 12:45
Show Gist options
  • Save thoriqmacto/e25718f84393e1caccb6b13686419a6a to your computer and use it in GitHub Desktop.
Save thoriqmacto/e25718f84393e1caccb6b13686419a6a to your computer and use it in GitHub Desktop.
JavaScript function for run typing effect
function runTyping() {
var element = document.querySelector('#output');
var typeSpeed = 100; // 80 ms
var deleteSpeed = 30; // 30 ms
var deleteAfter = 1000; // 1 second
var items = [
"I sleep",
"I eat",
"I learn",
"I swim",
"I walk"
];
/* END SETTINGS */
var sentence = 0;
var currentChar = 0;
var direction = 1;
var deleteInterval = null;
function type() {
if (sentence >= items.length) {
sentence = 0;
}
var chars = items[sentence].split("");
setTimeout(function() {
if (currentChar >= chars.length) {
setTimeout(function() {
sentence++;
deleteInterval = setInterval(function() {
element.innerHTML = element.innerHTML.substr(0, currentChar - 1);
currentChar--;
if (currentChar == 1) {
clearInterval(deleteInterval);
type();
}
}, deleteSpeed);
}, deleteAfter);
return;
}
element.innerHTML += chars[currentChar];
currentChar++;
type();
}, typeSpeed);
}
type();
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment