Mehrere Countdown Timer auf einer Seite

Mastema

Grünschnabel
Hallo,

ich kenne mich leider nur sehr begrenzt mit JavaScript aus und habe im Internet (ich glaube es war sogar hier auf tutorials.de) ein JavaScript für einen Countdown-Timer gefunden:

Code:
<script type='text/javascript'>
window.onload=secondCount;
var lngSekunden = 1000;
function secondCount(){
intStunden = Math.floor(lngSekunden/(60*60));
intStunden = (intStunden < 10) ? '0'+intStunden : intStunden;
lngHelpSekunden = lngSekunden - intStunden*60*60;
intMinuten = Math.floor(lngHelpSekunden/60);
intMinuten = (intMinuten < 10) ? '0'+intMinuten : intMinuten;
intSekunden = lngHelpSekunden - intMinuten*60;
intSekunden = (intSekunden < 10) ? '0'+intSekunden : intSekunden;
strZeit = intStunden + ':' + intMinuten + ':' + intSekunden;
document.getElementById('countdown').innerHTML = strZeit;
lngSekunden--;
if(lngSekunden >= 0) window.setTimeout('secondCount()', 1000);
if(lngSekunden <= 0) location.href = '/';
}
</script>

Das funktioniert für sich alleine auch problemlos, doch nun will ich auf der selben Seite bis zu 10 verschiedene Countdowns anzeigen, einfach mehrfach den Code benutzen, nur mit angepasstem
Code:
document.getElementById('countdown').innerHTML = strZeit;
funktioniert nicht (hätte mich auch gewundert, bei ansonsten gleichen Funktions- bzw. Variablennamen).

Muss ich da jetzt 10 mal den ganzen Code anpassen, also alle Funktionen / Variablen umbenennen oder geht das auch anders (falls ja, wie?)?
 
Hi und Willkommen bei tutorials.de,

ja, das geht auch ohne den zehnfachen Code, und zwar:

a) Mach aus IngSekunden ein Array, mit einem Startwert pro Countdown.

b) Ändere secondCount so ab, dass es einen Arrayindex als Parameter bekommt
und diesen Wert vom Array eben verwendet.

Javascript:
function secondCount(index){
	intStunden = Math.floor(lngSekunden[index]/(60*60));
	...
	if(lngSekunden >= 0) window.setTimeout('secondCount(index)', 1000);
...
}

c) Mach eine neue Funktion für onload, die in einer Schleife secondCount(0)
bis secondCount(9) aufruft (bzw. bis zur Arraylänge, ist flexibler).

d) Ist diese Sache mit location.href am Funktionsende beabsichtigt?
Damit wechselst du die Seite am Ende des schnellsten Countdowns.
 
Zurück