Muckel1986
Erfahrenes Mitglied
Guten Abend zusammen,
dank der Suchmaschienen habe ich nun ein JavaScript gefunden, welches einen Countdown zu einem Ziel-Datum mit Ziel-Uhrzeit erstellt:
Wie ihr sehen könnt, ist die Ausgabe des "Countdown" in einem Formular-Bereich als input Feld. Gut, dank CSS kann man auch das ein wenig gestalten, aber wäre es möglich das als Absatz (p), span oder DIV auszugeben?
Und wenn das vielleicht geändert werden könnte, habe ich wenn es möglich ist, noch zwei Fragen/Wünsche. Wenn die Halbzeit/Bergfest erreicht ist, könnte man für diesen Tag eine Möglichkeit schaffen, dass automatisch ein anderer Inhalt gelanden wird? Oder müsste ich dafür auf php setzten und z.B. eine IF-Anweisung nehmen, die das Datum abfragt und wenn nur dieser eine Tag da ist, das dann eine anderer Inhalt geladen wird? Also nach dem Chema "Wenn Datum X, dann Inhalt A, sonst Inhalt B". Geht das auch mit Ajax/JavaScript?
Wäre schön, wenn ihr mir helfen könnt!
Liebe Grüße
Muckel
dank der Suchmaschienen habe ich nun ein JavaScript gefunden, welches einen Countdown zu einem Ziel-Datum mit Ziel-Uhrzeit erstellt:
HTML:
<!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>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="author" content="Muckel">
<meta name="description" content="Ein Countdown zu einem Zieldatum inklusive der Uhrzeit.">
<meta name="keywords" lang="de" content="Counter,Countdown,zaehlen,wie lange noch">
<meta http-equiv="content-language" content="de">
<meta name="robots" content="all">
<title>Countdown</title>
<link href="style.css" rel="stylesheet" type="text/css" />
<script language="JavaScript">
// Ziel-Datum in MEZ
var jahr=2010, monat=12, tag=27, stunde=15, minute=00, sekunde=00;
var zielDatum=new Date(jahr,monat-1,tag,stunde,minute,sekunde);
function countdown() {
startDatum=new Date(); // Aktuelles Datum
// Countdown berechnen und anzeigen, bis Ziel-Datum erreicht ist
if(startDatum<zielDatum) {
var jahre=0, monate=0, tage=0, stunden=0, minuten=0, sekunden=0;
// Jahre
while(startDatum<zielDatum) {
jahre++;
startDatum.setFullYear(startDatum.getFullYear()+1);
}
startDatum.setFullYear(startDatum.getFullYear()-1);
jahre--;
// Monate
while(startDatum<zielDatum) {
monate++;
startDatum.setMonth(startDatum.getMonth()+1);
}
startDatum.setMonth(startDatum.getMonth()-1);
monate--;
// Tage
while(startDatum.getTime()+(24*60*60*1000)<zielDatum) {
tage++;
startDatum.setTime(startDatum.getTime()+(24*60*60*1000));
}
// Stunden
stunden=Math.floor((zielDatum-startDatum)/(60*60*1000));
startDatum.setTime(startDatum.getTime()+stunden*60*60*1000);
// Minuten
minuten=Math.floor((zielDatum-startDatum)/(60*1000));
startDatum.setTime(startDatum.getTime()+minuten*60*1000);
// Sekunden
sekunden=Math.floor((zielDatum-startDatum)/1000);
// Anzeige formatieren
(jahre!=1)?jahre=jahre+" Jahre, ":jahre=jahre+" Jahr, ";
(monate!=1)?monate=monate+" Monate, ":monate=monate+" Monat, ";
(tage!=1)?tage=tage+" Tage, ":tage=tage+" Tag, ";
(stunden!=1)?stunden=stunden+" Stunden, ":stunden=stunden+" Stunde, ";
(minuten!=1)?minuten=minuten+" Minuten und ":minuten=minuten+" Minute und ";
if(sekunden<10) sekunden="0"+sekunden;
(sekunden!=1)?sekunden=sekunden+" Sekunden":sekunden=sekunden+" Sekunde";
document.countdownform.countdowninput.value=
jahre+monate+tage+stunden+minuten+sekunden;
setTimeout('countdown()',200);
}
// Anderenfalls alles auf Null setzen
else document.countdownform.countdowninput.value=
"0 Jahre, 0 Monate, 0 Tage, 0 Stunden, 0 Minuten und 00 Sekunden";
}
</script>
</head>
<body onload="countdown()">
<!-- hier steht noch etwas Text... -->
<form name="countdownform">
<p><input size="75" name="countdowninput"></p>
</form>
<!-- auch hier ist nochmal Text -->
</body>
</html>
Und wenn das vielleicht geändert werden könnte, habe ich wenn es möglich ist, noch zwei Fragen/Wünsche. Wenn die Halbzeit/Bergfest erreicht ist, könnte man für diesen Tag eine Möglichkeit schaffen, dass automatisch ein anderer Inhalt gelanden wird? Oder müsste ich dafür auf php setzten und z.B. eine IF-Anweisung nehmen, die das Datum abfragt und wenn nur dieser eine Tag da ist, das dann eine anderer Inhalt geladen wird? Also nach dem Chema "Wenn Datum X, dann Inhalt A, sonst Inhalt B". Geht das auch mit Ajax/JavaScript?
Wäre schön, wenn ihr mir helfen könnt!
Liebe Grüße
Muckel