Salutations devnet!
I need to make a counter that will start counting from $1 on the first of the month of February to lets say $2000 on the last day of March... I have done searches on google for somethin like this and not been able to find anything like this....ideas anyone?
javascript number count up
Moderator: General Moderators
Re: javascript number count up
Here is what I have so far....its bascally 2 jqueries in one.
Code: Select all
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<script type="text/javascript" src="https://www.google.com/jsapi"></script>
<script type="text/javascript">
google.load("search", "1");
google.load("jquery", "1.4.2");
google.load("jqueryui", "1.7.2");
</script>
<script type="text/javascript">
function tick() {
currentTime = getTime();
displayMessage(currentTime);
Clock.innerHTML = currentTime;
window.setTimeout("tick();", 100);
}
function getTime() {
var hours, minutes, seconds, ap;
var intHours, intMinutes, intSeconds;
var today;
today = new Date();
intHours = today.getHours();
intMinutes = today.getMinutes();
intSeconds = today.getSeconds();
if (intHours <= 12) {
hours = intHours;
ap = "AM";
} else {
hours = (intHours-12);
ap = "PM";
}
minutes = formatDigits(intMinutes);
seconds = formatDigits(intSeconds);
return hours+":"+minutes+":"+seconds+ap;
}
function displayMessage(currTime){
newMessage = "default";
timeSplits = new Array("10:40:00PM", "10:41:00PM", "10:42:00PM", "10:43:00PM", "10:44:00PM", "10:45:00PM", "10:46:00PM", "10:47:00PM", "10:48:00PM", "10:49:00PM", "10:50:00PM");
theMessages = new Array("Fourty", "Fourty-1", "Fourty-2", "Fourty-3", "Fourty-4", "Fourty-5", "Fourty-6", "Fourty-7", "Fourty-8", "Fourty-9", "Fifty");
for (var i=0; i<timeSplits.length; i++){
dateA = new Date("January 01, 2000 "+currTime);
dateB = new Date("January 01, 2000 "+timeSplits[i]);
if (dateA >= dateB){
newMessage = theMessages[i];
}
}
strMessage.innerHTML = newMessage;
}
function formatDigits(xxx) {
if (xxx < 10)
return "0"+xxx;
return xxx;
}
window.onload = tick;
</script>
<script type="text/javascript">
(function($) {
$.fn.countTo = function(options) {
// merge the default plugin settings with the custom options
options = $.extend({}, $.fn.countTo.defaults, options || {});
// how many times to update the value, and how much to increment the value on each update
var loops = Math.ceil(options.speed / options.refreshInterval),
increment = (options.to - options.from) / loops;
return $(this).each(function() {
var _this = this,
loopCount = 0,
value = options.from,
interval = setInterval(updateTimer, options.refreshInterval);
function updateTimer() {
value += increment;
loopCount++;
$(_this).html(value.toFixed(options.decimals));
if (typeof(options.onUpdate) == 'function') {
options.onUpdate.call(_this, value);
}
if (loopCount >= loops) {
clearInterval(interval);
value = options.to;
if (typeof(options.onComplete) == 'function') {
options.onComplete.call(_this, value);
}
}
}
});
};
$.fn.countTo.defaults = {
from: 0, // the number the element should start at
to: 100, // the number the element should end at
speed: 1000, // how long it should take to count between the target numbers
refreshInterval: 100, // how often the element should be updated
decimals: 2, // the number of decimal places to show
onUpdate: null, // callback method for every time the element is updated,
onComplete: null, // callback method for when the element finishes updating
};
})(jQuery);
</script>
<title>Title of document</title>
</head>
<body>
<script type="text/javascript"><!--
jQuery(function($) {
$('.timer').countTo({
from: 50,
to: 2500,
speed: 1000,
refreshInterval: 50,
onComplete: function(value) {
console.debug(this);
}
});
});
//--></script>
$<span class="timer"></span>
<div id=Clock style="FONT-FAMILY: Verdana; FONT-SIZE: 10pt"> </div><br /><br />
<div id=strMessage style="FONT-FAMILY: Verdana; FONT-SIZE: 10pt"> </div>
</body>
</html>
Re: javascript number count up
ideas anyone?