Pure JavaScript Typewriter Effect With HTML Content

How to make a simple typewriter with pure javascript?

Make simple typing effect with HTML content using javascript


var str = "<p>Make simple <b>typing</b> effect with <span style='color:#E8117F;'>HTML content</span> and <img src='http://placehold.it/150x150/DF5646/FFF'> image! using javascript</p>",
    i = 0,
    isTag,
    text;

(function type() {
    text = str.slice(0, ++i);
    if (text === str) return;

    document.getElementById('typewriter').innerHTML = text;

    var char = text.slice(-1);
    if (char === '<') isTag = true;
    if (char === '>') isTag = false;

    if (isTag) return type();
    setTimeout(type, 80);
}());
Pure JavaScript Typewriter Effect With HTML Content Pure JavaScript Typewriter Effect With HTML Content Reviewed by Bhaumik Patel on 7:43 PM Rating: 5