Simulate scrolling text in javascript

Question

I\'m trying to come up with something to simulate an old school modem connection. I.E. text that paints itself at variable speeds rather than rendering at once.

Her

Answer 1

Don't use jQuery when it comes to milliseconds-speed, and at least cache the references. To make the animation faster than the minimum timeout, you can only append more than one character a time. Especially if you want a similiar speed cross devices, you should use a longer timeout because the minimum value can vary - a standard animation speed is 60 frames per second.

function displayText(id, text) {
    var node = document.createTextNode(""),
        i = 0,
        chars = 5;
    document.getElementById(id).appendChild(node);

    (function add(){
        node.data += text.substr(i, chars);
        i += chars;
        if (i < text.length)
            setTimeout(add, 1000/60);
    })();
}

Demo at jsfiddle.net