A simple Vanilla JavaScript plugin that animates any message you want. No jQuery is needed. No pretentions, just for fun
• Download or fork the repository.
• Include the CSS & Javascript file minify or not in your HTML.
• Ensure you have a container within the DOM any element with the class by default "typethis" or the one you want to use, but remember to set it at the className option.
• Initialize your writer.
var typethis = new Typethis();
• Remember you can customize some features
var typethis = new Typethis({ autoWriting: true, autoWritingDelay : 0, className : ".typethis", delay: 600, loop: false, speed : [200,600], words: ["The sentences", " you want", " to", "be shown"] });
autoWriting | Starts when the page is loaded or it is fired when an events occurs |
autoWritingDelay | If autoWriting property is false you could set a trigger to fire it or indicate a delay to start writing. |
className | The class of the element that the plugin searches within the DOM |
delay | The time in ms that the sentence is been displayed since it is completed until it is delete |
loop | Inifinite/Linear |
speed | Range of time in ms that detemines the speed of the writing |
words | Your content |
Please, take this Demo as it is, and feel free to download, modify, break, use or destroy this code.