Typo types the way a real person types. There are subtle variations in speed, occasional errors that are corrected, and a general feeling of humanity.
Usage
First, grab a copy here.
Then, put some text in an element and add some configuration attributes:
<div id="typo" data-typo-chance="5" data-typing-delay="60" data-typing-jitter="20">Typo types the way a real person types. There are subtle variations in speed, occasional errors that are corrected, and a general feeling of humanity.</div>Finally, call the function:
document.addEventListener('DOMContentLoaded', function() {
var element = document.getElementById('typo');
var text = element.innerHTML;
typo(element, text);
});
Configuration
You can adjust these three configuration attributes:
- data-typo-chance, the percentage chance that any given typed character will be typed incorrectly
- data-typing-delay, the delay between keystrokes
- data-typing-jitter, the +/- jitter for delays
That’s it. I hope you enjoy it.