-1

Mi pregunta es si se puede generar de alguna forma o bien con JavaScript un número que empiece por ejemplo desde el 70000 y nunca acabe de autoincrementar.

Vi este efecto en muchas webs como por ejemplo Taringa, entre otras, en las que ponen: Usuarios: 1.236.547, Post: 13.255.698, etc y estos números van aumentando poco a poco.

Lo que quiero lograr es simplemente que el el sidebar de Wordpress un número aparezca, por ejemplo a partir del 70000 y se vaya incrementando.

Conseguí en el siguiente enlace algo que me podría valer:

jQuery.fn.extend({
  animateCount : function (from, to, time) {
    var steps = 1,
        self = this,
        counter;

    if (from - to > 0) {
      steps = -1;
    };

    from -= steps;

    function step() {
      self.val(from += steps);

      if ((steps < 0 && to >= from) || (steps > 0 && from >= to)) {
        clearInterval(counter);
      };
    };

    counter = setInterval(step, time || 100);
  }
});

$('#runner').click(function() {
    $('#count').animateCount(1,100);
})
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>

<input type="hidden" value="100000" id="amount"/>
<input type="text" value="0" id="count"/>
<input type="button" value="run" id="runner"/>

Lo negativo es que es mediante un botón, no es automático el inicio del incremento cuando carga la web. Espero se pueda captar mejor la idea con ese código de ejemplo.

3
  • 1
    Tu pregunta es demasiado amplia y cada uno de nosotros pudiéramos darte una forma diferente de hacerlo. Leer por favor ejemplo mínimo verificable y edita tu pregunta para ser mas concreto.
    – David Isla
    Commented el 15 jul. 2017 a las 18:11
  • 1
    Esos números que van aumentando provienen generalmente de la base de datos. Son datos reales que se actualizan con cada visita o usuario. Claro que se puede poner datos falsos pero no te recomiendo hacer esto. Commented el 15 jul. 2017 a las 18:35
  • Una de las cosas que hacía la pregunta demasiado amplia era el preguntar por como hacer algo en uno u otro lenguaje. Como el ejemplo es de JavaScript eliminé la mención de PHP.
    – Rubén
    Commented el 16 jul. 2017 a las 14:37

2 respuestas 2

0

Repuesta corta

Usa el operador de incremento ++ y setTimeout para hacer el incremento de forma automática.

Código

A continuación un ejemplo de un "autoincrementador" que agrega uno cada medio segundo. Para simular que carga la página, se debe hacer click en ejecutar.

function contar() {
    document.getElementById('txt').innerHTML = cuenta++;
    setTimeout(contar, 500);
}

var cuenta = 0;
contar();
<div id="txt"></div>

En una página web, agrega la etiqueta div en la etiqueta body y el código JavaScript al final.

Te quedaría algo como lo que sigue:

<html>
  <body>
    <div id="txt"></div>
    <script>
      function contar() {
        document.getElementById('txt').innerHTML = cuenta++;
        setTimeout(contar, 500);
      }

      var cuenta = 0;
      contar();
    </script>
  </body>
</html>

Explicación

  1. Al cargarse la página
    1. Se asigna a cuenta el valor de 0.
    2. Se llama la función contar.
  2. La función contar,
    1. Asigna el valor de cuenta a un elemento de la página y le suma uno.
    2. Espera medio segundo y llama a la función contar.
0

Si tu problema es que comience a contar desde que cargue la pagina cambia de tu codigo de click a ready:

$('#runner').click(function() {
    $('#count').animateCount(1,100);
})

Solucion:

$('#runner').ready(function() {
    $('#count').animateCount(1,100);
})

Solo como una observacion que debes de tomar en cuenta, es que el numero mas grande permitido en javascript es de 9007199254740992, tratando de pasar ese valor seguramente tendras un valor erroneo.

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.