Silvestercounter 02
Dynamischer Downcounter bis zum 31. Dezember 24 Uhr des laufenden Jahres. Darstellung als Text in einem 'unsichtbaren' Formularfeld.
|
|
dynamische Datums- Uhrzeitinformationen im Formularfeld
Die Funktion 'showtime()' entnimmt im Abstand von 1 Sekunde dem Systemdatum den aktuellen Wert. Aus diesem Wert werden verbleibenden Monate, Tage, Stunden, Minuten und Sekunden bis zum Zieldatum 31.Dez. 24 Uhr ermittelt und angezeigt.
Anzeige: Monate - Tage - Stunden - Minuten - Sekunden
Der Einfachheit halber werden die Informationen in einem 'unsichtbaren' / nicht als solches erkennberen Formularfeld angezeigt. Keine aufwändige Positionierungs-Anweisungen für die unterschiedlichen Browser. Die Information wird genau dort angezeigt, wo sie das Formularfeld für die Anzeige notieren.
(Hier ist das Formularfeld noch erkennbar)
Aufwand zum 'Einbau' des Scripts
- Script in den Head-Bereich kopieren
- Formular im Body-Bereich notieren
- Anzeigefeld / - text formatieren
Ausgabe / Anzeige des Counters
Im Body-Bereich an entsprechender Stelle notieren:
<form>
<input class="anzeige" id="Zeit" type="text" readonly>
</form>
Mit CSS-Anweisungen im Head der Seite werden Angaben für die Unterklasse 'anzeige' fetgelegt:
<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: 24px;
}
-->
</style>
'unsichtbares' Formularfeld
Wenn sie Rand- und Hintergrundfarbe ihrem Seitenhintergrund anpassen (identische Farbwerte), ist das Formularfeld als solches nicht erkennbar!
<style type="text/css">
<!--
.anzeige {
font-size:12px;
color:#0000FF;
background-color: #FFFFFF;
text-align:center;
border: none;
width: 545px;
padding:3px;
height: 24px;
}
-->
</style>
Bemerkung
Bei diesem Beispiel nutze ich nicht das simplere Verfaheren zwei Datumswerte
(Silvester und Heute) einfach zu subtrahieren, mit
var Differenz = Silvester.getTime() - Heute.getTime();
sondern zeige wie man den Wert auf Grund der unterschiedlichen Längen der einzelnen Monate berechnet. Dabei muss man auf jeden Fall eine Untersuchung Schaltjahr ja / nein anstellen. Eine umständliche Berechnungsweise, aber als Demo zum Verfahren zur Berechnung von Datumswerten gut geeignet.

Downcounter für die Statuszeile
Downcounter bis 24 Uhr (große Ziffernanzeige)

|