/    Sign up×
Community /Pin to ProfileBookmark

[RESOLVED] Countdown timer jumps values

I am creating this countdown clock, that will later be turned into a slot machine, where my php script will output to the javascript the values to countdown to.

all seems to work, just a small hickup. for some reason the middle value, display2() countsdown to 0, then jumps up to its actual value
ex: [url]http://cyber-wars.com/time.html[/url]

code is below

[CODE]
<html>
<head></head>
<body>
<table border=1>
<tr><td id=”d1″ STYLE=”font-size: 48″></td><td id=”d2″ STYLE=”font-size: 48″></td><td id=”d3″ STYLE=”font-size: 48″></td></tr></table>

<script>
<!–
//
var milisec=”50″;
var milisec2=”65″;
var milisec3=”77″;

function display(){
if (milisec<=9){
//make sure to change both variables to actual value
milisec=”9″;
milishort=”9″;
}

else
mililength = milisec.toString();

if(mililength.length>1 && milisec !=9){
milishort = mililength.substring(1);
}
milisec=milisec-1;
document.getElementById(‘d1’).innerHTML=milishort;
setTimeout(“display()”,75);
}

function display2(){
if (milisec2<=2){
//make sure to change both variables to actual value
milisec2=”3″;
milishort2=”3″;
}

else
mililength2 = milisec2.toString();

if(mililength2.length>1 && milisec2 !=3){
milishort2 = mililength2.substring(1);
}
milisec2=milisec2-1;
document.getElementById(‘d2’).innerHTML=milishort2;
setTimeout(“display2()”,75);
}

function display3(){
if (milisec3<=7){
//make sure to change both variables to actual value
milisec3=”7″;
milishort3=”7″;
}

else
mililength3 = milisec3.toString();

if(mililength3.length>1 && milisec3 !=7){
milishort3 = mililength3.substring(1);
}
milisec3=milisec3-1;
document.getElementById(‘d3’).innerHTML=milishort3;
setTimeout(“display3()”,75);
}

display();
display2();
display3();
–>
</script>
</body>
</html>
[/CODE]

any help would be appreciated, also i know i suck at JS, if anyone could help clean this up, i would be grateful

thanks,
PaPPy

to post a comment
JavaScript

5 Comments(s)

Copy linkTweet thisAlerts:
@PaPPyauthorNov 28.2008 — if no one can help with the problem can u help consolidate the script please?
Copy linkTweet thisAlerts:
@CuppyTeaNov 28.2008 — Im finding it extremely difficult to work out what the code is doing... if you could explain what effect you want to do, I will gladly have a go at attemping to fix/ improve the code.
Copy linkTweet thisAlerts:
@PaPPyauthorNov 28.2008 — [CODE]
//what to start counting down from
var milisec="50";
var milisec2="65";
var milisec3="77";

function display(){
if (milisec<=9){
//make sure to change both variables to actual value
//the acutal number to display
milisec="9";
milishort="9";
}

else
//convert the number to a string
mililength = milisec.toString();


//if the length of the number is 2(meaning 11) strip the first one off, to look like a slot machine
//i do this so it just displays 0-9, but still counts down in miliseconds

if(mililength.length>1 && milisec !=9){
milishort = mililength.substring(1);
}

//subtract the miliseconds, and set the div tag to the shortened milisecond value
milisec=milisec-1;
document.getElementById('d1').innerHTML=milishort;
setTimeout("display()",75);
}
[/CODE]


here it is for the first function, as all 3 are the same comments go accordingly to those too
Copy linkTweet thisAlerts:
@MrNobodyNov 28.2008 — if no one can help with the problem can u help consolidate the script please?[/QUOTE]
This solves both problems:
[code=html]<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Language" content="en-us">
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Slot Machine</title>
<script type="text/javascript">
function SpinSlot(id, stop, count, delay)
{
var str;
document.getElementById(id).innerHTML = (str=count.toString()).substr(str.length-1);
if (count > stop)
{
window.setTimeout("SpinSlot('"+id+"', "+stop+", "+(--count)+", "+delay+")", delay);
}
}
window.onload = function()
{
window.setTimeout("SpinSlot('d1', 9, 50, 75)", 10);
window.setTimeout("SpinSlot('d2', 3, 65, 75)", 20);
window.setTimeout("SpinSlot('d3', 7, 77, 75)", 30);
return true;
}
</script>
</head>

<body>
<table border=1>
<tr>
<td id="d1" STYLE="font-size: 48pt"></td>
<td id="d2" STYLE="font-size: 48pt"></td>
<td id="d3" STYLE="font-size: 48pt"></td>
</tr>
</table>
</body>
</html>[/code]
Copy linkTweet thisAlerts:
@PaPPyauthorNov 28.2008 — This solves both problems:
[/QUOTE]


yaaaaaaaaaaaay ur awesome thank you
×

Success!

Help @PaPPy spread the word by sharing this article on Twitter...

Tweet This
Sign in
Forgot password?
Sign in with TwitchSign in with GithubCreate Account
about: ({
version: 0.1.9 BETA 5.18,
whats_new: community page,
up_next: more Davinci•003 tasks,
coming_soon: events calendar,
social: @webDeveloperHQ
});

legal: ({
terms: of use,
privacy: policy
});
changelog: (
version: 0.1.9,
notes: added community page

version: 0.1.8,
notes: added Davinci•003

version: 0.1.7,
notes: upvote answers to bounties

version: 0.1.6,
notes: article editor refresh
)...
recent_tips: (
tipper: @AriseFacilitySolutions09,
tipped: article
amount: 1000 SATS,

tipper: @Yussuf4331,
tipped: article
amount: 1000 SATS,

tipper: @darkwebsites540,
tipped: article
amount: 10 SATS,
)...