Avatar billede showsource Seniormester
08. juli 2008 - 19:37 Der er 15 kommentarer og
1 løsning

Hvordan laver men et countdown script?

Hej
Der findes en masse javascripts som tæller ned, men nu ville jeg så selv prøve mig frem.
Indtil videre har jeg:

function countd($seconds) {

var oneM = 60;
var oneH = (60*60);

var Htime = Math.floor($seconds/oneH);
var Mtime = Math.floor(($seconds-(Htime*oneH))/oneM);
var Stime = Math.floor($seconds-(Htime*oneH)-(Mtime*oneM));

alert(Htime+' '+Mtime+' '+Stime);

}

Og lige nu er jeg gået lidt i stå.

setTimeout() funktionen, hvad gør den egentlig?

Og jeg vil helst ikke bruge inner.HTML, men er sgutte heller så meget i det DOM halløj, desværre.

"Udpenslet" forklaring til hvad og hvordan ville være rigtigt fint! :O)
Avatar billede w13 Novice
08. juli 2008 - 19:44 #1
setTimeout() bruges til at gøre noget efter x-antal sekunder.
Prøv f.eks.:

window.setTimeout("alert('hej');",2000);

Bemærk at kommandoen skal stå i gåseøjne og at man indikerer tiden i ms., i dette tilfælde 2000, som jo svarer til 2 sekunder.

Du kan også bruge window.setInterval("alert('hej');",2000);

Denne vil blive ved med at blive kørt hvert andet sekund og ville nok være mere relevant for dig.
Avatar billede showsource Seniormester
08. juli 2008 - 20:06 #2
Hmm, jeg har et andet script som jeg engang fik "klippet/klistret" sammen, er her bruges

var counter;

Og senere inde i en funktion, "countDown()":
counter=setTimeout("countDown()", 1000);

og sidst i scriptet kaldes det så med:
countDown(Text());

Text() er en funktion som laver document.write til en div, hvori antal sekunder tælles ned.

Så er lidt forvirret med Interval og Timeout.
Avatar billede w13 Novice
08. juli 2008 - 21:02 #3
Ja, her kaldes setTimeout hver gang funktionen kører. Synes det er langt mere optimalt at bruge window.setInterval i stedet.

function countd($seconds) {

var oneM = 60;
var oneH = (60*60);

var Htime = Math.floor($seconds/oneH);
var Mtime = Math.floor(($seconds-(Htime*oneH))/oneM);
var Stime = Math.floor($seconds-(Htime*oneH)-(Mtime*oneM));

alert(Htime+' '+Mtime+' '+Stime);

}

window.setInterval("kald funktionen countd() med det rigtige parameter her",1000);
Avatar billede w13 Novice
08. juli 2008 - 21:04 #4
Og hvis du har elementet:

<span id="timetext">&nbsp;</span>

kan du vise tiden i dette med DOM således:

document.getElementById("timetext").firstChild.nodeValue=Htime+" "+Mtime+" "+Stime;
Avatar billede w13 Novice
08. juli 2008 - 21:11 #5
Nu forstår jeg, hvad du vil med din kode.

************************************************

function countd($seconds) {

    var oneM = 60;
    var oneH = (60*60);

    var Htime = Math.floor($seconds/oneH);
    var Mtime = Math.floor(($seconds-(Htime*oneH))/oneM);
    var Stime = Math.floor($seconds-(Htime*oneH)-(Mtime*oneM));

    document.getElementById("timetext").firstChild.nodeValue=Htime+" "+Mtime+" "+Stime;

    if($seconds){
        window.setTimeout("countd("+$seconds-1+");",1000);
    }

}

countd(14);

************************************************

If-sætningen omkring window.setTimeout sørger for, at scriptet kun fortsætter, hvis $seconds er over 0.
Avatar billede w13 Novice
08. juli 2008 - 21:12 #6
Jeg er dog ikke sikker på, man må indlede sine variabler med $ i JavaScript.
Avatar billede w13 Novice
08. juli 2008 - 21:14 #7
Og da oneM og oneH er statiske, kunne du måske spare browseren for den udregning, selvom det er en petitesse:

function countd($seconds) {

    var Htime = Math.floor($seconds/3600);
    var Mtime = Math.floor(($seconds-(Htime*3600))/60);
    var Stime = Math.floor($seconds-(Htime*3600)-(Mtime*60));

    document.getElementById("timetext").firstChild.nodeValue=Htime+" "+Mtime+" "+Stime;

    if($seconds){
        window.setTimeout("countd("+$seconds-1+");",1000);
    }

}

countd(14);
Avatar billede showsource Seniormester
09. juli 2008 - 13:47 #8
Hvad med et svar?
Avatar billede w13 Novice
09. juli 2008 - 13:48 #9
Det kan du da godt få! ;)
Avatar billede showsource Seniormester
10. juli 2008 - 06:28 #10
Takker!
Avatar billede w13 Novice
10. juli 2008 - 12:37 #11
Og tak for point! :)
Avatar billede showsource Seniormester
10. juli 2008 - 23:11 #12
Lige et spm. :O)

Hvis jeg prøver at tilføje en var, kommer den ikke med ?

function countd(allseconds,minvar) {

........
}

"minvar" er altid undefined
Det er vel seTimeout() der gør det, men kan man ikke hente en "ekstra" var ?
Avatar billede w13 Novice
11. juli 2008 - 04:45 #13
Så skal du jo overføre en ekstra værdi, når du kalder countd - f.eks.:

countd(14,"hejhej");

Medmindre "minvar" skal være statisk for funktionen, så skal den ikke sådan men derimod puttes ind i funktionen sådan her:

var minvar = "hejhej";
Avatar billede showsource Seniormester
11. juli 2008 - 12:41 #14
njahh, ikke rigtigt.
Hvis jeg kalder
countd(5,1);

er 1 med før første nedtælling, men ikke efter.
Ville bruge det som mulighed for at bestemme hvad som ske ved nedtælling til 0
Avatar billede showsource Seniormester
11. juli 2008 - 12:43 #15
arghhh, det er sgu da mig selvf. som er et fjols!
setTimeout har ikke min ekstra parameter med!
Avatar billede w13 Novice
11. juli 2008 - 12:52 #16
:)
Avatar billede Ny bruger Nybegynder

Din løsning...

Tilladte BB-code-tags: [b]fed[/b] [i]kursiv[/i] [u]understreget[/u] Web- og emailadresser omdannes automatisk til links. Der sættes "nofollow" på alle links.

Loading billede Opret Preview
Kategori
Vi tilbyder markedets bedste kurser inden for webudvikling

Log ind eller opret profil

Hov!

For at kunne deltage på Computerworld Eksperten skal du være logget ind.

Det er heldigvis nemt at oprette en bruger: Det tager to minutter og du kan vælge at bruge enten e-mail, Facebook eller Google som login.

Du kan også logge ind via nedenstående tjenester