1. This site uses cookies. By continuing to use this site, you are agreeing to our use of cookies. Learn More.

Javascript Digit Increaser (counter)

Discussion in 'HTML & JavaScript' started by NX_NULL, Jun 28, 2012.

  1. NX_NULL

    NX_NULL Regular Member Premium Member

    Joined:
    Dec 31, 2008
    Messages:
    309
    Likes Received:
    425
    Hey guys,

    Can any one tell me how to make a counter like the one which is showing number of Megabytes on gmail.com website

    Code:
    Lots of space
    Over 10262.524579 megabytes (and counting) of free storage. 
    
    I am going to write a number like that without decimal and increasing

    any body has any idea ?


    rep and thanks will be given to any one help
    thanks
     
  2. thejake

    thejake Jr. VIP Jr. VIP Premium Member

    Joined:
    Nov 13, 2009
    Messages:
    685
    Likes Received:
    828
    Code:
    <p id="counts">100</p>
    <script type="text/javascript">
    var cnt=parseInt(document.getElementById('counts').innerText);
    setInterval(function(){document.getElementById('counts').innerHTML=cnt+=(parseInt(Math.random()*4)+1);},1000);
    </script>
    
     
    • Thanks Thanks x 1
  3. NX_NULL

    NX_NULL Regular Member Premium Member

    Joined:
    Dec 31, 2008
    Messages:
    309
    Likes Received:
    425
    I runned it, but it changed to NaN
    any idea ?
     
  4. thejake

    thejake Jr. VIP Jr. VIP Premium Member

    Joined:
    Nov 13, 2009
    Messages:
    685
    Likes Received:
    828
    The <p id="counts">100</p> is important
     
    • Thanks Thanks x 1
  5. NX_NULL

    NX_NULL Regular Member Premium Member

    Joined:
    Dec 31, 2008
    Messages:
    309
    Likes Received:
    425
    http://jsbin.com/asewig

    in FF it shows NaN and in other browsers it shows some random number but not increasing
     
  6. thejake

    thejake Jr. VIP Jr. VIP Premium Member

    Joined:
    Nov 13, 2009
    Messages:
    685
    Likes Received:
    828
    Oops
    Code:
    
    
    <p id="counts">100</p>
    <script type="text/javascript">
    var cnt=parseInt(document.getElementById('counts').innerHTML);
    setInterval(function(){document.getElementById('counts').innerHTML=cnt+=(parseInt(Math.random()*4)+1);},1000);
    </script>
    
     
    • Thanks Thanks x 1
  7. NX_NULL

    NX_NULL Regular Member Premium Member

    Joined:
    Dec 31, 2008
    Messages:
    309
    Likes Received:
    425
    great man

    How to add some thing like this to it ?
    <p id="counts">14,763,265</p> it will omit those comma and start from 14, is there any way that it shows the numbers with comma ?

    thank you
     
  8. thejake

    thejake Jr. VIP Jr. VIP Premium Member

    Joined:
    Nov 13, 2009
    Messages:
    685
    Likes Received:
    828
    Tricky

    Code:
    <p id="counts">10,000,000</p>
    <script type="text/javascript">
    var cnt=parseInt(document.getElementById('counts').innerHTML.replace(/,/g,""));
    setInterval(function(){document.getElementById('counts').innerHTML=(cnt+=(parseInt(Math.random()*4)+1)).toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",");},1000);
    </script>
    
     
    • Thanks Thanks x 1