ejemplos - Incremento del valor Div javascript

innerhtml value

Question

Estoy tratando de hacer un div con un valor animado que aumente hasta su valor final. Aquí hay un ejemplo de themeforest: http://demo.themesvision.com/drupal/evolve/ (cliente feliz, proyectos completados, etc.)

He intentado muchas líneas de código diferentes sin éxito. Pude hacer el incremento, pero no puedo imaginar cómo hacer un retraso cada vez que hay un incremento. He intentado setTimeout () y setInterval ().

Aquí está mi código hasta ahora:

$(document).ready(function(){
    test();

    function test(){
        var i = 0;
        while ( i <= 100 ) {
            $("#test").text(i);
            i++;
        }
    }
});

¡Gracias de antemano!

Answer 1

Necesitas algo como:

$(document).ready(function(){
    var i = 0;

    test();

    function test(){
        $("#test").text(i++);
        if(i < 100) {
            setTimeout(test, 500);
        }
    }
});

Answer 2

for (var i = 0; i < 100; i++) { //For loop easier than while loop
    setTimeout(function() { //SetTimeout
        document.getElementById(''test'').textContent++; //...Where you increment the textContent
    }, i * 20); //...At interval of 20ms
}