Ask your WordPress questions! Pay money and get answers fast! (more info)

JQuery number ticker that goes up by 1 every 0.0013s WordPress

  • SOLVED

I need a number ticker that starts at 35000 and goes up by 1 every 0.0013s. Website is Inkspotwifi.co.uk and the tickers to go at the top right side where it currently says "10761 Network Users"

Answers (4)

2012-10-22

Dbranes answers:

hi, here is a javascript number ticker (no php needed) that calculates the counter value from a date,
so it will also work when you reload the page:

html:
result: <div id="counter"></div>


javascript:

var START_DATE = new Date("October 10, 2012 22:30:00"); // put in the starting date here
var INTERVAL = 1; // in seconds
var INCREMENT = 30; // increase per tick
var START_VALUE = 35001; // initial value when it's the start date
var count = 0;

$(document).ready(function() {
var msInterval = INTERVAL * 1000;
var now = new Date();
count = parseInt((now - START_DATE)/msInterval) * INCREMENT + START_VALUE;
document.getElementById('counter').innerHTML = count;

window.setInterval( function(){
count += INCREMENT;
document.getElementById('counter').innerHTML = count;
}, msInterval);

});


see here:

http://jsfiddle.net/fKve9/


ps: this is a modified version of this answer:

http://stackoverflow.com/a/3346311


patrickclover comments:

OOO almost, just need to make it to 1decimal place now?


patrickclover comments:

var n=count.toFixed(1);
Got it!


patrickclover comments:

Maybe not, didnt work.


Dbranes comments:


ok, I guess you mean the case: 1/0.0013 ~ 769.2

Here is an updated version (I added the count.toFixed(0) to display the counter,
I guess it must be an integer, since it stands for users.)

html:
<div id="counter"></div> Network Users


javascript:
var START_DATE = new Date("October 21, 2012 22:30:00"); // put in the starting date here
var INTERVAL = 1; // refresh interval in seconds
var INCREMENT = 769.2; // increase per tick (1/0.0013 ~ 769.2)
var START_VALUE = 35000; // initial value when it's the start date
var count = 0;

$(document).ready(function() {
var msInterval = INTERVAL * 1000;
var now = new Date();
count = parseInt((now - START_DATE)/msInterval) * INCREMENT + START_VALUE;
$('#counter').html(count.toFixed(0));

window.setInterval( function(){
count += INCREMENT;
$('#counter').html(count.toFixed(0));
}, msInterval);

});
‚Äč


see demo here:

[[LINK href="http://jsfiddle.net/nQjPE/"]]http://jsfiddle.net/nQjPE/[[/LINK]]


patrickclover comments:

This JS seems to not be quite playing right, any ideas? maybe make a separate file? suggestions?


patrickclover comments:

Error:
Problem at line 10 character 10: Missing radix parameter.
count = parseInt((now - START_DATE)/msInterval) * INCREMENT + START_VALUE;

Implied global: $ 7,11,15, window 13


Dbranes comments:


you can try to replace:

count = parseInt((now - START_DATE)/msInterval) * INCREMENT + START_VALUE;


with:

count = parseInt((now - START_DATE)/msInterval,10) * INCREMENT + START_VALUE;


i.e. parseInt can have second parameter (radix)

What browser are you using?


patrickclover comments:

Nope still doesn't work ehm IE4?
jk, chrome canary the link you sent works but it doesn't when i try add it to the site.


Dbranes comments:

hehe IE4 rocks ;-)

you could try to replace $ with jQuery (in 3 places)


patrickclover comments:

var msInterval = INTERVAL * 1300000;

- problem solved. just change the time multiplier, seemed to do the trick!

2012-10-22

Arnav Joy answers:

see this link

http://papermashup.com/jquery-dynamic-number-ticker/

2012-10-22

daas answers:


<span id="custom_users"></span>
<script>
var div = document.getElementById( 'custom_users' );
var i = 35000;

setInterval(function(){ div.innerHTML=i; i++; },1.3)
</script>

try this


patrickclover comments:

ticks too often, resets back to 35000 on page reload.

2012-10-22

Gabriel Reguly answers:

Hi Patrick,

I assume you already have jQuery set, so please try this
<script type="text/javascript">
jQuery (function() {
var cnt = 35000;
var counter = setInterval(function() {
jQuery('#header-phone').html( cnt + ' Network Users' );
cnt++;
}
}, 1.3);
});
</script>


Regards,
Gabriel