Skip to content
an automatic writer
JavaScript HTML CSS
Branch: master
Clone or download
Latest commit 00083fa Jul 26, 2019
Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
css Add files via upload Aug 17, 2016
js autoWriting and autoWritingDelay properties added Oct 13, 2016
LICENSE Initial commit Aug 17, 2016
README.md update domain Jul 26, 2019
index.html autoWriting and autoWritingDelay properties added Oct 13, 2016

README.md

Type-this|

A simple Vanilla JavaScript plugin that animates any message you want. No jQuery is needed. No pretentions, just for fun

Demo

Demo 1 | Demo 2 | Demo 3

Usage

• 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"]
    });

Options

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

Final thoughts

Please, take this Demo as it is, and feel free to download, modify, break, use or destroy this code.

You can’t perform that action at this time.