Digital Uhren

Scripte > Daytime

Digital-Uhren in vielfältiger Auswahl

Javascript-Uhren, ob groß oder klein - eine kleine Auswahl an digitalen Uhren. Diese Uhren sind im handumdrehen auf der Homepage eingebaut. Die Uhren können individuell nach Bedarf über die Style-Eigenschaften angepasst werden. Dazu auch die Hinweise bei den jeweiligen Uhren beachten.

ZIP-Datei in ein beliebiges Verzeichnis auf dem PC entpacken und das Verzeichnis "wsX5Obj" auf den Webserver in das Root-Verzeichnis kopieren. Je nach einzubauender Uhr den Javascript-Code in den HEAD-Bereich <head>....</head>, ONLOAD-Code in den Bodytag <body onload="..."> und HTML-Code in den BODY-Bereich <body>....</body> der aufrufende Datei einfügen.

Eine demo.html ist jeweils beigefügt, die zum Test in das Root-Verzeichnis des Webservers kopiert werden kann.

Aufruf: "http://www.domain.tld/demo.html". Diese kann aber auch durch einen Doppelklick ausgeführt werden.

Javascript Digi-Time1

Javascript Digi-Time2

Bei diesen Digital-Uhren sind mehrere unterschiedliche digi-Pakete im Verzeichnis "digis" hinterlegt, die im Javascript- bzw. HTML-Code nach eigenen Vorstellungen durch einen Paketaustausch verändert werden können.

x runter geladen

Code für den <HEAD> Bereich

href="wsX5Obj/Obj18_1/digitime.css" />

Vor dem </HEAD> Tag

Code für den <HEAD> Bereich

Vor dem </HEAD> Tag

Code für den <BODY> Tag

onload="Obj18_1a();"

Wer nicht mit Website X5 arbeitet:

Innerhalb des <BODY> Tag

Code für den <BODY> Tag

onload="Obj18_1b();"

Wer nicht mit Website X5 arbeitet:

Innerhalb des <BODY> Tag

Code für den <BODY> Bereich

<nobr>

<img class="Obj18_1-dg" name="HZ"

src="wsX5Obj/Obj18_1/digits/digi_color/digi.gif">

<img class="Obj18_1-dg" name="HE"

src="wsX5Obj/Obj18_1/digits/digi_color/digi.gif">

<img class="Obj18_1-dp" name="DP"
src="wsX5Obj/Obj18_1/digits/digi_color/digi.gif">

<img class="Obj18_1-dg" name="MZ"

src="wsX5Obj/Obj18_1/digits/digi_color/digi.gif">

<img class="Obj18_1-dg" name="ME"

src="wsX5Obj/Obj18_1/digits/digi_color/digi.gif">

</nobr>

Nach dem <BODY> Tag

Code für den <BODY> Bereich

Nach dem <BODY> Tag

Code Datei "digitime.css"

/* je nach Digits widht: + height: anpassen */

.Obj18_1-dg {width: 20px; height: 30px; border: 0px;}

.Obj18_1-dp {width: 10px; height: 30px; border: 0px;}

Javascript Runs-Time

Die Apassung an die Homepage erfolt über die Datei "runstime.css". In der Javascript-Datei "runstime.js" sind mehrere Ausgabetexte hinterlegt, die mit dem Parameter DispString und der ausgewählten Ziffer geändert werden können.

x runter geladen

Code für den <HEAD> Bereich

Vor dem </HEAD> Tag

Code für den <BODY> Bereich

<div id="Obj18_2"></div>

</div>

Nach dem <BODY> Tag

Code Datei "runstime.css"

/* Anpassung an Homepage und Balkenbreie */

#Obj18_2 { position: relative; width: 600px; border: 2px solid #000000; text-align: center; padding: 6px;

font-family: Tahoma; color: #00E090; font-size:24px; background-color: #5F5F5F; }

Javascript Ami-Time1

Javascript Ami-Time2

Hier erfolgt die Ausgabe im amerikanischen Zeit-Format (am/pm). Die Anpassungen an die Homepage bzw. Farb- und Größengestaltung werden je nach Auswahl in den Dateien "amitime3a.css" bzw. "amitime3b.css" durchgeführt.

x runter geladen

Code für den <HEAD> Bereich

href="wsX5Obj/Obj18_3/amitime3a.css" />

Vor dem </HEAD> Tag

Code für den <HEAD> Bereich

href="wsX5Obj/Obj18_3/amitime3b.css" />

Vor dem </HEAD> Tag

Code für den <BODY> Bereich

<form class="Obj18_3a-frm" name="Obj18_form">

<input class="Obj18_3a-out" type="txt"
name="Obj18_output">

</form>

</div>

Nach dem <BODY> Tag

Code für den <BODY> Bereich

<div id="Inp18_3b" class="Obj18_3b-frm"></div>

</div>

Nach dem <BODY> Tag

Code Datei "amitime3a.css"

/* Anpassung an Homepage */

.Obj18_3a-frm {

width: 145px;
background-color: #B30607;
border: 2px solid #000;
padding: 12px;
text-align: center;
}

.Obj18_3a-out {

width: 145px;
font-family: tahoma;
font-size: 20px;
color: #000;
font-weight: bold;
text-align: center;
background-color: #B30607;
border: 0px;
}

Code Datei "amitime3b.css"

/* Anpassung an Homepage */

.Obj18_3b-frm {

background-color: #000;
border: #999 2px inset;
padding: 4px;
color: #B30607;
font-family: "Arial Black", Gadget, sans-serif;
font-size: 24px;
font-weight: bold;
letter-spacing: 2px;
display: inline;
}

» nach oben «