Counter bis Zieldatum + Zeit 01
Dynamischer Downcounter bis zu einer bestimmten Uhrzeit an einem bestimmten Datum. Zum Beispiel bis 12:14'30 am 24.12. 2020. Darstellung als Text in einem 'unsichtbaren' Formularfeld. Anzeige von
Tage - Stunden - Minuten - Sekunden
16.06.2008, Hinweis zum Eintrag des Monats als Ziffer
Keine aufwendige Positionierungs-Anweisungen für die unterschiedlichen Browser. Die Information wird genau dort angezeigt, wo sie das Formularfeld für die Anzeige notieren.
Hinter den berechneten Werten wird eine Beschreibung angehängt, die sie in einer Variablen (Beschreibung) ablegen können.
var Beschreibung = "Heiligabend 2020";
Aufwand
- Script in den Head-Bereich kopieren
- CountDown-Ziel eintragen
- Formular im Body-Bereich notieren
- Anzeigefeld / - text formatieren
Zieldatum und Zeit festlegen
Datum und Uhrzeit für das CountDown-Ziel werden in der Variablen 'ZielDatum' abgelegt. Dazu haben sie Varianten zur Auswahl:
1) Notierung als Ziffernfolge
Bitte halten sie sich an die Norm der Datumsvorgabe und trennen die Eingabewerte durch ein Komma:
Eintrag in der Reihenfolge: Jahr, Monat-1, Tag, Stunden, Minuten, Sekunden
Um bis zum 24. Dezember 2020 um 12:10 Uhr herunter zu zählen, müssen demnach folgende Werte eingetragen werden:
var ZielDatum = new Date(2020,11,24,12,10,00);
Kalendermonatszahl - 1 (minus Eins)
Wenn das Datum als Ziffernfolge eingetragen wird beachten sie, dass der Monatswert in der für JavaScript üblichen Zählweise, beginnend bei Null notiert werden muss. Denn im Array (Register) der Monatsnamen ist der Januar das Arrayelement 0 (Null), Februar das Element 1 (Eins), März das Element 2 (Zwei), ...
Demnach ist der Dezember im Register der Monate das ArrayElement 11. Sinnvolle Werte für den Monatseintag sind Zahlen von 0 bis 11.
2) Notierung als Datumsfolge
Wenn sie bis 24 Uhr des Zieldatums herunterzählen möchten, können die Einträge für die Zeit (Std, Min, Sek) auch entfallen. Die alternative Eintrageform sieht ein wenig anders aus. Sie müssen allerdings die englischen Bezeichnungen für den Monatsnamen verwenden!
Eintrag in der Reihenfolge: Monatsname Tag Jahr Zeit
var ZielDatum = new Date("December 24 2020 12:10:00");
Englische Schreibweise des Monatsnamens beachten:
January, February, March, April, May, June, July,
August, September, October, November, December
Ausgabe / Anzeige des Counters
Im Body-Bereich an entsprechender Stelle notieren:

<form>
<input readonly class="anzeige" type="text" id="Zeit">
</form>
class="anzeige"
Formatierung
Mit CSS-Anweisungen im Head der Seite legen sie die Angaben für das Formular und den Text im Input-Feld fest. Wenn sie Rand- und Hintergrundfarbe ihrem Seitenhintergrundanpassen (identische Farbwerte), ist das Formularfeld nicht erkennbar!

<style type="text/css">
<!--
.anzeige {
font-size:12px;
color:#6F6F6F;
background-color: #F0F4FF;
text-align:center;
border: 1px solid #6F6F6F;
width: 545px;
padding:3px;
height: 22px;
}
-->
</style>
Testen
Zum Testen des Scripts:
verstellen sie das Systemdatum Nachdem sie das Datum verstellt haben, laden sie die Seite neu, indem sie 'Aktuelle Seite neu laden' (Refresh) anklicken.
Querverweise:
Downcounter bis Neujahr für die Statuszeile
Downcounter bis Neujahr 02 (Monate Tage Std Min Sec)
weitere Counter finden sie im Menü 'Datum'

|