Javascript Textuhren - Website X5 Helpsite

Logo Schriftzug
Logo WSX5
Scan QR or Download Android App
Direkt zum Seiteninhalt

Javascript Textuhren

Scripte > Daytime

Zwei textbasierte Javascript Uhren

Eine Uhr auf der Homepage ist heutzutage nichts besonderes mehr. Dafür um so mehr sind textbasierte Uhren ein Hingucker auf jeder Webseite. Die Funktionen werden jeweils über die Javascript-Datei gesteuert. In der jeweiligen CSS-Datei können die Anpassungen an die Homepage vorgenommen werden sowie die Größe, Form und Farbe der textbasierten Ausgabe. Wer keinen Rahmen mit Hintergrund möchte, entfernt einfach die Zeilen background-color: ...; und border: ...;  in der dazugehörigen CSS-Datei.
ZIP-Datei in ein beliebiges Verzeichnis auf dem PC entpacken.
HEAD-Code in den HEAD-Bereich <head>...</head> 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.
Uhrzeitanzeige
Download Button
x runter geladen
Code für den <HEAD> Bereich
<link rel="stylesheet" href="wsX5Obj/Obj16_1/texttime.css" />
<script src="wsX5Obj/Obj16_1/texttime.js"></script>
Code für den <BODY> Bereich
<div align="center">
<div id="uhr" class="Obj16_form">Uhrzeitanzeige</div>
<script>Obj16_1();</script>
</div>
Code Datei "texttime.css"
.Obj16_time { color: #DB0D00; font-weight: bold; font-size: 18px; }
.Obj16_form { width: 580px; line-height: 100%; text-align: justify; font-size: 14px; color: #999;
white-space: pre-line; background-color: #fff; border: 2px solid #999; margin: 20px; padding: 20px; }
Code Datei "texttime.js"
function Obj16_1() {
var hl="<span class='Obj16_time'>";
var he="</span>";
var zahl="";
var text="";
var nachts=0;
var tageszeit="";
var points=".....";
var Datum = new Date();
var Stunden = Datum.getHours();
var Minuten = Datum.getMinutes();
var Sekunden = Datum.getSeconds();
if (Minuten >=0) {
text="gleich fünf zehn viertel zwanzig kurz nach vor halb";}
if (Minuten >1) {
text="gleich fünf zehn viertel zwanzig "+hl+"kurz nach"+he+" vor halb";}
if (Minuten >4) {
text="gleich " +hl+ "fünf" +he+ " zehn viertel zwanzig kurz "+hl+"nach"+he+" vor halb";}
if (Minuten >9) {
text="gleich fünf " +hl+ "zehn" +he+ " viertel zwanzig kurz "+hl+"nach"+he+ " vor halb";}
if (Minuten >14) {
text="gleich fünf zehn " +hl+ "viertel" +he+ " zwanzig kurz "+hl+"nach" +he+ " vor halb";}
if (Minuten >19) {
text="gleich fünf zehn viertel " +hl+ "zwanzig" +he+ " kurz "+hl+"nach" +he+ " vor halb";}
if (Minuten >24) {
text="gleich " +hl+ "fünf" +he+ " zehn viertel zwanzig kurz nach" +hl+ " vor halb"+he;}
if (Minuten >29) {
text="gleich fünf zehn viertel zwanzig kurz nach vor" +hl+" halb"+he;}
if (Minuten >34) {
text="gleich "+hl+"fünf"+he+" zehn viertel zwanzig kurz "+hl+"nach"+he+" vor "+hl+"halb"+he;}
if (Minuten >39) {
text="gleich fünf zehn viertel "+hl+"zwanzig"+he+" kurz nach " +hl+"vor"+he+" halb";}
if (Minuten >44) {
text="gleich fünf zehn "+hl+"viertel"+he+" zwanzig kurz nach " +hl+"vor"+he+" halb";}
if (Minuten >49) {
text="gleich fünf "+hl+"zehn"+he+" viertel zwanzig kurz nach " +hl+"vor"+he+" halb";}
if (Minuten >54) {
text="gleich "+hl+"fünf"+he+" zehn viertel zwanzig kurz nach " +hl+"vor"+he+" halb";}
if (Minuten >58) {
text=hl+"gleich"+he+" fünf zehn viertel zwanzig kurz nach vor halb";}
if (Minuten >24) {Stunden=Stunden+1;}
if (Stunden >12) {Stunden=Stunden-12;nachts=1;}
if (Stunden == 1) {
zahl=hl+"eins"+he+" zwei drei vier fünf sechs sieben acht neun zehn elf zwölf "+hl+"uhr"+he;}
if (Stunden == 2) {
zahl="eins "+hl+"zwei"+he+" drei vier fünf sechs sieben acht neun zehn elf zwölf "+hl+"uhr"+he;}
if (Stunden == 3) {
zahl="eins zwei "+hl+"drei"+he+" vier fünf sechs sieben acht neun zehn elf zwölf "+hl+"uhr"+he;}
if (Stunden == 4) {
zahl="eins zwei drei "+hl+"vier"+he+" fünf sechs sieben acht neun zehn elf zwölf "+hl+"uhr"+he;}
if (Stunden == 5) {
zahl="eins zwei drei vier "+hl+"fünf"+he+" sechs sieben acht neun zehn elf zwölf "+hl+"uhr"+he;}
if (Stunden == 6) {
zahl="eins zwei drei vier fünf "+hl+"sechs"+he+" sieben acht neun zehn elf zwölf "+hl+"uhr"+he;}
if (Stunden == 7) {
zahl="eins zwei drei vier fünf sechs "+hl+"sieben"+he+" acht neun zehn elf zwölf "+hl+"uhr"+he;}
if (Stunden == 8) {
zahl="eins zwei drei vier fünf sechs sieben "+hl+"acht"+he+" neun zehn elf zwölf "+hl+"uhr"+he;}
if (Stunden == 9) {
zahl="eins zwei drei vier fünf sechs sieben acht "+hl+"neun"+he+" zehn elf zwölf "+hl+"uhr"+he;}
if (Stunden == 10) {
zahl="eins zwei drei vier fünf sechs sieben acht neun "+hl+"zehn"+he+" elf zwölf "+hl+"uhr"+he;}
if (Stunden == 11) {
zahl="eins zwei drei vier fünf sechs sieben acht neun zehn "+hl+"elf"+he+" zwölf "+hl+"uhr"+he;}
if (Stunden == 12) {
zahl="eins zwei drei vier fünf sechs sieben acht neun zehn elf "+hl+"zwölf"+he+" "+hl+"uhr"+he;}
while(Minuten>5) {Minuten=Minuten-5;}
if (Minuten == 1) {points=hl+"."+he+"....";}
if (Minuten == 2) {points=hl+".."+he+"...";}
if (Minuten == 3) {points=hl+"..."+he+"..";}
if (Minuten == 4) {points=hl+"...."+he+".";}
tageszeit="mittags nachts";
if (nachts==0) {
if (Stunden == 12){tageszeit=hl+"mittags"+he+" nachts";}
if (Stunden == 1) {tageszeit="mittags "+hl+"nachts"+he;}
if (Stunden == 2) {tageszeit="mittags "+hl+"nachts"+he;}
if (Stunden == 3) {tageszeit="mittags "+hl+"nachts"+he;}
if (Stunden == 4) {tageszeit="mittags "+hl+"nachts"+he;}
if (Stunden == 5) {tageszeit="mittags "+hl+"nachts"+he;}
}
if (nachts==1) {
if (Stunden == 12){tageszeit="mittags "+hl+"nachts"+he;}
}
document.getElementById("uhr").innerHTML =
"<p style='line-height:25px;'>"+hl+"es ist"+he+" "+text+ " "+zahl+" "+ tageszeit +points+"</p>";
timerID = setTimeout("Obj16_1()",1000)
}
Download Button
x runter geladen
Code für den <HEAD> Bereich
<link rel="stylesheet" href="wsX5Obj/Obj16_2/wordtime.css" />
<script src="wsX5Obj/Obj16_2/wordtime.js"></script>
Code für den <BODY> Bereich
<div align="center">
<div class="Obj16_out" id="Obj16_2"></div>
</div>
Code Datei "wordtime.css"
.Obj16_out { width: 580px; font-family: tahoma; font-size: 14px; font-weight: bold; color: #00f;
line-height: 100%; text-align: center; white-space: pre-line; background-color: #fff;
border: 1px solid #000; margin: 20px; padding: 20px; }
Code Datei "wordtime.js"
var stunden = new Array;
stunden["0"] = "Null";
stunden["1"] = "Ein";
stunden["2"] = "Zwei";
stunden["3"] = "Drei";
stunden["4"] = "Vier";
stunden["5"] = "Fünf";
stunden["6"] = "Sechs";
stunden["7"] = "Sieben";
stunden["8"] = "Acht";
stunden["9"] = "Neun";
stunden["10"] = "Zehn";
stunden["11"] = "Elf";
stunden["12"] = "Zwölf";
stunden["13"] = "Dreizehn";
stunden["14"] = "Vierzehn";
stunden["15"] = "Fünfzehn";
stunden["16"] = "Sechzehn";
stunden["17"] = "Siebzehn";
stunden["18"] = "Achtzehn";
stunden["19"] = "Neunzehn";
stunden["20"] = "Zwanzig";
stunden["21"] = "Einundzwanzig";
stunden["22"] = "Zweiundzwanzig";
stunden["23"] = "Dreiundzwanzig";
var minuten = new Array;
minuten["0"] = "Null";
minuten["1"] = "Eine";
minuten["2"] = "Zwei";
minuten["3"] = "Drei";
minuten["4"] = "Vier";
minuten["5"] = "Fünf";
minuten["6"] = "Sechs";
minuten["7"] = "Sieben";
minuten["8"] = "Acht";
minuten["9"] = "Neun";
minuten["10"] = "Zehn";
minuten["11"] = "Elf";
minuten["12"] = "Zwölf";
minuten["13"] = "Dreizehn";
minuten["14"] = "Vierzehn";
minuten["15"] = "Fünfzehn";
minuten["16"] = "Sechzehn";
minuten["17"] = "Siebzehn";
minuten["18"] = "Achtzehn";
minuten["19"] = "Neunzehn";
minuten["20"] = "Zwanzig";
minuten["21"] = "Einundzwanzig";
minuten["22"] = "Zweiundzwanzig";
minuten["23"] = "Dreiundzwanzig";
minuten["24"] = "Vierundzwanzig";
minuten["25"] = "Fünfundzwanzig";
minuten["26"] = "Sechsundzwanzig";
minuten["27"] = "Siebenundzwanzig";
minuten["28"] = "Achtundzwanzig";
minuten["29"] = "Neunundzwanzig";
minuten["30"] = "Dreißig";
minuten["31"] = "Einunddreißig";
minuten["32"] = "Zweiunddreißig";
minuten["33"] = "Dreiunddreißig";
minuten["34"] = "Vierunddreißig";
minuten["35"] = "Fünfunddreißig";
minuten["36"] = "Sechsunddreißig";
minuten["37"] = "Siebenunddreißig";
minuten["38"] = "Achtunddreißig";
minuten["39"] = "Neununddreißig";
minuten["40"] = "Vierzig";
minuten["41"] = "Einundvierzig";
minuten["42"] = "Zweiundvierzig";
minuten["43"] = "Dreiundvierzig";
minuten["44"] = "Vierundvierzig";
minuten["45"] = "Fünfundvierzig";
minuten["46"] = "Sechsundvierzig";
minuten["47"] = "Siebenundvierzig";
minuten["48"] = "Achtundvierzig";
minuten["49"] = "Neunundvierzig";
minuten["50"] = "Fünfzig";
minuten["51"] = "Einundfünfzig";
minuten["52"] = "Zweiundfünfzig";
minuten["53"] = "Dreiundfünfzig";
minuten["54"] = "Vierundfünfzig";
minuten["55"] = "Fünfundfünfzig";
minuten["56"] = "Sechsundfünfzig";
minuten["57"] = "Siebenundfünfzig";
minuten["58"] = "Achtundfünfzig";
minuten["59"] = "Neunundfünfzig";
function zeit() {
var Heute = new Date();
var h = Heute.getHours();
var m = Heute.getMinutes();
var s = Heute.getSeconds();
var text = stunden[h] + " Uhr und "
+ minuten[m] + (m == "01" ? " Minute" : " Minuten")
+ " und " + minuten[s] + (s == "01" ? " Sekunde" : " Sekunden");
document.getElementById("Obj16_2").innerHTML = text;
}
window.addEventListener("load", zeit);
window.setInterval('zeit()', 998);

» nach oben «
Logo Host Europe
Button Spenden
🏠 © 2009 - 2024
Hosting by
Zurück zum Seiteninhalt