Javascript Countdown

**[jacky]** · 08.04.2006 23:48

Hallo,

ich habe folgenden HTML Code:

Code:

<b>text some text, some text, in <span class="dd">10</span> sekunden, oo, bar</b>

ich möchte, dass die 10 in 1 Sekundenschritten bis auf 0 heruntergezählt wird!

Geht das?

Danke!!

**Malleus** · 09.04.2006 00:02

Hi, so etwas in der Art:

Code:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> 
<html>
<head>
<title>Countdown</title>
<script type="text/javascript">
function countDown(init)
{
	if (init || --document.getElementById( "counter" ).firstChild.nodeValue >0 )
			window.setTimeout("countDown()",1000);
};

</script>

</head>

<body>
<button onclick="countDown(true)">Start</button><br>

<b>text some text, some text, in <span id="counter" class="dd">10</span> sekunden, oo, bar</b>

</body>
</html>

Tschau

Frank

**[jacky]** · 09.04.2006 03:08

Ja danke, das werde ich doch glatt mal einbauen

**Malleus** · 11.04.2006 21:28

Alles klar, freut' mich, daß ich helfen konnte!

**Tanek** · 21.09.2007 14:59

Ich nutze mal diesen Thread, da ja die Überschrift zu meinem Problem passt

Ich hab hier einen Countdown-Script, jedoch wird auf meiner Seite nichts angezeigt - was fehlt denn da? Wenn überhaupt was fehlt...

HTML-Code:

<script language="JavaScript">
TargetDate = "10/31/2007 12:00 AM";
BackColor = "171717";
ForeColor = "FFFFFF";
CountActive = true;
CountStepper = -1;
LeadingZero = true;
DisplayFormat = "Bis zum Erscheinungstermin sind es noch %%D%% Days, %%H%% Hours, %%M%% Minutes and %%S%% Seconds.";
FinishMessage = "Die Zeit ist vorbei!";
</script>
                    <script language="JavaScript" src="js/countdown.js"></script>

Gruß Tanek

**asyoulikeit** · 22.10.2007 18:37

Naja, ich würd mal sagen... es fehlt ein Code. Du hast da nur Zuweisungen zu Variablen, aber mit denen wird nichts gemacht. Irgendwo muss da noch eine Formel rein, die den countdown berechnet. Ich weiß ja nicht, wo Du das her hast, aber wahrscheinlich hast Du nicht alles abgeschrieben. Bzw. irgendwo gibt es einen Ordner /js in dem die Datei countdown.js liegen müsste. Such mal.

**Speedy19102000** · 23.10.2007 03:23

Moin!

Code:

<html>

<head><title>Test</title>

<script type="text/javascript">

datum='30.1.2008 15:46:00';
begintext = 'Es sind noch ';
endtext = ' bis zum nächsten Event.';
meldungWennFertig='Fertig';
dDatum=datum.split(' ');
dZeit=dDatum[1];
dDatum=dDatum[0].split('.');
datum=dDatum[1]+'/'+dDatum[0]+'/'+dDatum[2]+' '+dZeit;
ziel=new Date(datum);
var tick;
st=3600000;
m=60000;
function zaehl(){
tempD=new Date();
if(ziel<=tempD){
clearTimeout('tick');
document.getElementById('countdown').innerHTML=meldungWennFertig;
return;
}
tage=0;
while(tempD<ziel){
tempD.setDate(tempD.getDate()+1);
tage++
}
if(tempD>ziel){
tempD.setDate(tempD.getDate()-1);
tage--
}
diff=ziel-tempD;
stunden=Math.abs(diff)/st;
gStunden=Math.floor(stunden); 
minuten=Math.abs(diff)/m-(60*gStunden);
gMinuten=Math.floor(minuten);
sekunden=Math.abs(diff)/1000-(3600*gStunden)-(60*gMinuten);
gSekunden=Math.round(sekunden);
tage=tage==0?'':tage+' Tage, ';
if(gStunden==0&&tage=='')gStunden='';
else gStunden=gStunden+' Stunden, ';
if(gMinuten==0&&gStunden=='')gMinuten='';
else gMinuten=gMinuten+' Minuten ';
gSekunden=gSekunden+' Sekunden';
if(gSekunden==60)gSekunden='';
str=begintext+tage+gStunden+gMinuten+'und '+gSekunden+endtext;
document.getElementById('countdown').innerHTML=str;
tick=setTimeout("zaehl();", 1000);
}

</script>

</head>

<body onload="zaehl()">

<span id="countdown"></span>

</body>

</html>

MfG Speedy

**chorn** · 07.09.2010 09:43

Aufgeräumt und angepasst, es können jetzt mehrere Countdowns angezeigt werden, das Datum wird in englisher Notation übergeben.

Code:

<html>
<head>
<title>Test</title>
<script type="text/javascript">

function zaehl( datum_en, document_id ){

	ziel              = new Date(datum_en);
	tempD             = new Date();
	
	begintext         = 'Es sind noch ';
	endtext           = ' bis zum nächsten Event.';
	meldungWennFertig = 'Fertig';
	
	st                = 3600000;
	m                 = 60000;

	var tick;

	if(ziel<=tempD){

		clearTimeout('tick');
		document.getElementById(document_id).innerHTML=meldungWennFertig;
		return;

	}
	
	tage=0;
	
	while(tempD<ziel){

		tempD.setDate(tempD.getDate()+1);
		tage++

	}

	if(tempD>ziel){

		tempD.setDate(tempD.getDate()-1);
		tage--

	}

	diff=ziel-tempD;
	stunden=Math.abs(diff)/st;
	gStunden=Math.floor(stunden); 
	minuten=Math.abs(diff)/m-(60*gStunden);
	gMinuten=Math.floor(minuten);
	sekunden=Math.abs(diff)/1000-(3600*gStunden)-(60*gMinuten);
	gSekunden=Math.round(sekunden);
	tage=tage==0?'':tage+' Tage, ';
	
	if(gStunden==0&&tage=='')gStunden='';
	else gStunden=gStunden+' Stunden, ';
	
	if(gMinuten==0&&gStunden=='')gMinuten='';
	else gMinuten=gMinuten+' Minuten ';
	
	gSekunden=gSekunden+' Sekunden';
	if(gSekunden==60)gSekunden='';
	
	str=begintext+tage+gStunden+gMinuten+'und '+gSekunden+endtext;
	document.getElementById(document_id).innerHTML=str;
	tick=setTimeout("zaehl('"+ datum_en +  "', '" + document_id + "');", 1000);

}

</script>
</head>
<body>

<div id="c1"></div>
<div id="c2"></div>
<div id="c3"></div>

<script type="text/javascript">
	zaehl('1/30/2011 12:13', 'c1');
	zaehl('12/31/2010 9:11', 'c2');
	zaehl('1/30/2011 8:27', 'c3');
</script>

</body>
</html>

zur Startseite vom TP

Thema: Javascript Countdown

LinkBack

Themen-Optionen

Thema durchsuchen

Thema bewerten

Javascript Countdown

Aktive Benutzer

Aktive Benutzer