Loon3y
2. Juni 2008 um 11:52
1
Hallo…
mal wieder nervende fragen… urgs …endschuldigt.
Ich habe mir jetzt via JS einen „countdown“ gebastelt, der die Zeit zählt wie lange es zum Datum XX noch dauert.
Der code teilt sie wie folgt auf:
countdown.htm
[code]
Datum-Countdown mit JavaScript
[/code]und countdown.js
[code]
// Ziel-Datum in MEZ
var jahr=2008, monat=6, tag=3, stunde=21, minute=04, 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) 1 ? " Jahre": " Jahr") + ' , ';
monate = !monate ? '' : monate + (monate > 1 ? " Monate": " Monat") + ' , ';
tage = !tage ? '' : tage + (tage > 1 ? " Tage": " Tag") + ' , ';
stunden = !stunden ? '' : stunden + (stunden > 1 ? " Stunden": " Stunden") + ' , ';
minuten = !minuten ? '' : minuten + (minuten > 1 ? " Minuten": " Minuten") + ' , ';
sekunden = !sekunden ? '' : sekunden + (sekunden > 1 ? " Sekunden": " Sekunden");
document.countdownform.countdowninput.value=
jahre + monate + tage + stunden + minuten + sekunden;
setTimeout('countdown()',200);
}
}
[/code]Meine Frage nun:
Ist es möglich, den Countdown 2-zeilig anzeigen zu lassen und ohne diesen unförmigen rahmen? Sprich einfach so:
Jahr, Monat, Tag
Stunde, Minute, Sekunde
natürlich damit verbunden, wenn es keine Jahre mehr dauert, dann einfach "0 Jahre". Aber das ist ja logisch..
Gruß
Loon3y
BcF
2. Juni 2008 um 12:01
2
Mach das Input (samt Formular) im Quelltext weg und ersetz es durch
<div id="countdown"> </div>Und ersetze im JavaScript folgende Zeilen:
document.countdownform.countdowninput.value=
jahre + monate + tage + stunden + minuten + sekunden;
Durch folgende:
document.getElementById('countdown').innerHTML =
jahre + monate + tage + "<br />" + stunden + minuten + sekunden
Loon3y
2. Juni 2008 um 12:14
3
Wie meinst du es mit „Samt Formular“ ?
habe jetzt:
countdown.html:
[code]
Datum-Countdown mit JavaScript
[/code]und countdown.js
[code]
// Ziel-Datum in MEZ
var jahr=2008, monat=6, tag=3, stunde=21, minute=04, 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) 1 ? " Jahre": " Jahr") + ' , ';
monate = !monate ? '' : monate + (monate > 1 ? " Monate": " Monat") + ' , ';
tage = !tage ? '' : tage + (tage > 1 ? " Tage": " Tag") + ' , ';
stunden = !stunden ? '' : stunden + (stunden > 1 ? " Stunden": " Stunden") + ' , ';
minuten = !minuten ? '' : minuten + (minuten > 1 ? " Minuten": " Minuten") + ' , ';
sekunden = !sekunden ? '' : sekunden + (sekunden > 1 ? " Sekunden": " Sekunden");
document.getElementById('countdown').innerHTML =
jahre + monate + tage + "
" + stunden + minuten + sekunden
setTimeout('countdown()',200);
}
}
[/code]kommt ein weißes blatt wenn ich es im mozilla öffne...also nothing to see... hm.
beziehen "div's" nicht ihre daten aus css oder geht es ebenso aus .js-dateien ?
BcF
2. Juni 2008 um 12:43
4
Ein div ist für CSS, JavaScript etc. ein HTML-Element wie (fast) jedes andere, das spielt keine Rolle (zumal CSS mit Inhalt herzlich wenig zu tun hat).
Mit „samt Formular“ meinte ich, dass du das sowohl das Eingabefeld, als auch das Umgebende Formular (…) entfernen kannst.
Das ganze funktioniert übrigens wunderbar, du hast nur den Funktionsaufruf auch entfernt, der muss wieder rein:
<body onload="countdown()">
Loon3y
2. Juni 2008 um 12:52
5
dummer fehler meinerseits, endschuldige.
Jetzt muss nurnoch wieder, da ich es schon vor langer zeit rausgenommen habe, hin, dass 0 Jahre, 0 Monate, … angezeigt wird, sofern diese Werte nicht benutzt werden.
Davor hatte ich es zwar funktionierend, aber es war irgendwie unlogisch…
system
2. Juni 2008 um 13:25
6
Deswegen wäre es semantisch sinnvoller, statt eines
lieber ein
zu benutzen
Gruß,
Loon3y
2. Juni 2008 um 13:57
7
solange es so geht wie man es will und gut aussieht…passt es auch ^^ allerdings soll dieser countdown + zusätzl. textliches in ein div hinein…soll ich dann so sachen wie größe usw auch in diese .js datei schreiben?
und…wie bekomme ich hin, wenn ein werft 0 ist, das dann z.b. 0 Jahre dortsteht?
