 Digitale Uhr 01-a - Demo der Version 01
Hier zeige ich nichts Neues. Lediglich auf Wunsch und für absolute HTML- und JavaScript-Beginner eine Version der Digitalen Uhr 01. Den Quellcode für die Mini-Version der Uhr können sie ohne Änderungen für die Eintragung der kleineren Ziffern übernehmen.
Eingesetzt werden Mini-Ziffern mit den Abmessungen 11 x 14 Pixel. Weitere Images für digitale Ziffern finden sie auf der Seite Digitale Uhr 01.
Funktion
Die 8 Grafiken der Uhr stehen in einer Tabelle. Je 2 für Stunden-, Minuten- und Sekundendarstellung, getrennt durch ein Image für den Doppelpunkt. Eine Einbindung in eine Tabelle wäre nicht unbedingt erforderlich, gibt mir aber bei der Formatierung der Uhr weitere Gestaltungsmöglichkeiten.
|
|
|
|
|
background:#FEE237 |
border:1px solid |
border:3px double |
padding:2px |
Die dynamische, digitale Miniuhr in Aktion
Die Werte für die aktuelle Zeit werden der Systemzeit des lokalen Rechners entnommen. Eine Abfrage im Sekundentakt aktualisiert die Anzeige. Den Sekunden-, Minuten und Stundenwerten wird die Datenquelle für die entsprechenden Images zugeordnet und die Platzhalter in der Tabelle werden entsprechend ausgetauscht.
Aufwand:
1) Script in den Head-Bereich kopieren
2) Die Tabelle mit den Platzhaltern in den Body kopieren
3) die Grafiken in den Unterordner 'ziffern8' kopieren
Anpassungen
Alternative Darstellungen sind durch CSS-Angaben für die Hintergrundfarbe und der Randformatierung möglich. Tragen sie dazu die erweiterten Angaben in das <table>-Tag ein.
<table style="border: 5px solid #FFFF99;" bgcolor="#FFFF99" ... >
<table style="border: 1px solid #CFCFCF;" ... >
<table style="border: 1px solid #7F7F7F;" bgcolor="#CCFFCC" ... >
11 Images für die Darstellung
Die benötigten Grafiken können sie als ZIP-Datei herunterladen und im Ordner 'ziffern8' ablegen.
|
Home
Ziffern Nr. 8 
ScriptCode 
ZURÜCK 
