Tutorials
[ Zurück ]
Datum & Uhrzeit Anzeige
Hier mal eine Anleitung wie man das Datum und die Uhrzeit in der Homepage zeigen kann.
So sieht es am Ende aus, die farben können natürlich geändert werden.
Ich setzte hier wieder den gesammten Quelltext rein wo nur das auf der Seite ist, und schreibe die änderungen rot in Text.
Quelltext:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Datum und Uhr</title>
Der Teil ab hier muß in den Header Bereich.
<script language="JavaScript">
function uhr ()
{
var jahr;
var monat;
var tag;
var stunden;
var minuten;
var sekunden;
var AktuellesDatum=new Date();
jahr=AktuellesDatum.getFullYear ();
monat=AktuellesDatum.getMonth ()+1;
tag=AktuellesDatum.getDate ();
stunden=AktuellesDatum.getHours ();
minuten=AktuellesDatum.getMinutes ();
sekunden=AktuellesDatum.getSeconds ();
if (stunden<10)
{
stunden="0"+String(stunden);
}
if (minuten<10)
{
minuten="0"+String(minuten);
}
if (sekunden<10)
{
sekunden="0"+String(sekunden);
}
if (tag<10)
{
tag="0"+String(tag);
}
if (monat<10)
{
monat="0"+String(monat);
}
window.document.Datum.Date.value=tag+"."+monat+"."+jahr;
window.document.zeit.Time.value=stunden+":"+minuten+":"+sekunden;
window.setTimeout ('uhr()',1000);
}
</script>
Hier ist das Ende für den Teil der in den Headerbereich kommt.
</head>
<body onload="window.setTimeout ('uhr()',1000);">
Das dick gemachte hier oben, am besten gleich hinter body stehen lassen.
<table
style="width: 150px; height: 20px; margin-left: auto; margin-right: auto;"
border="0" cellpadding="0" cellspacing="0">
<tbody>
<tr>
<td
style="width: 75px; text-align: center; vertical-align: middle; height: 20px; background-color: rgb(255, 255, 255);">
Hier ist der Anfang vom der Datumsanzeige.
<form
style="margin-bottom: 0px; padding-top: 1px; width: 75px;"
name="Datum"><input
style="border: 0px none ; padding-top: 2px; padding-bottom: 2px; height: 20px; font-size: 9pt; color: black;"
size="10" name="Date"></form>
Die Datumanzeige endet hier.
</td>
<td
style="height: 20px; width: 75px; text-align: center; background-color: rgb(255, 255, 255);">
Hier ist der Anfang von der Uhrzeitanzeige.
<form name="zeit"
style="margin-bottom: 0px; padding-top: 1px; width: 75px;"><input
style="border: 0px none ; padding-top: 2px; padding-bottom: 2px; height: 20px; font-size: 9pt; color: black;"
size="10" name="Time"></form>
Die Uhrzeitsanzeige endet hier.
</td>
</tr>
</tbody>
</table>
</body>
</html>
Der Quelltext ist wie gesagt der Orginaltext, wenn ihr die rote Schrieft raus macht und das in ein HTML Text macht indem ihr da alles mit dem Text ersetzt bekommt ihr die Anzeige oben im Bild.
So sieht es am Ende aus, die farben können natürlich geändert werden.
Ich setzte hier wieder den gesammten Quelltext rein wo nur das auf der Seite ist, und schreibe die änderungen rot in Text.
Quelltext:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Datum und Uhr</title>
Der Teil ab hier muß in den Header Bereich.
<script language="JavaScript">
function uhr ()
{
var jahr;
var monat;
var tag;
var stunden;
var minuten;
var sekunden;
var AktuellesDatum=new Date();
jahr=AktuellesDatum.getFullYear ();
monat=AktuellesDatum.getMonth ()+1;
tag=AktuellesDatum.getDate ();
stunden=AktuellesDatum.getHours ();
minuten=AktuellesDatum.getMinutes ();
sekunden=AktuellesDatum.getSeconds ();
if (stunden<10)
{
stunden="0"+String(stunden);
}
if (minuten<10)
{
minuten="0"+String(minuten);
}
if (sekunden<10)
{
sekunden="0"+String(sekunden);
}
if (tag<10)
{
tag="0"+String(tag);
}
if (monat<10)
{
monat="0"+String(monat);
}
window.document.Datum.Date.value=tag+"."+monat+"."+jahr;
window.document.zeit.Time.value=stunden+":"+minuten+":"+sekunden;
window.setTimeout ('uhr()',1000);
}
</script>
Hier ist das Ende für den Teil der in den Headerbereich kommt.
</head>
<body onload="window.setTimeout ('uhr()',1000);">
Das dick gemachte hier oben, am besten gleich hinter body stehen lassen.
<table
style="width: 150px; height: 20px; margin-left: auto; margin-right: auto;"
border="0" cellpadding="0" cellspacing="0">
<tbody>
<tr>
<td
style="width: 75px; text-align: center; vertical-align: middle; height: 20px; background-color: rgb(255, 255, 255);">
Hier ist der Anfang vom der Datumsanzeige.
<form
style="margin-bottom: 0px; padding-top: 1px; width: 75px;"
name="Datum"><input
style="border: 0px none ; padding-top: 2px; padding-bottom: 2px; height: 20px; font-size: 9pt; color: black;"
size="10" name="Date"></form>
Die Datumanzeige endet hier.
</td>
<td
style="height: 20px; width: 75px; text-align: center; background-color: rgb(255, 255, 255);">
Hier ist der Anfang von der Uhrzeitanzeige.
<form name="zeit"
style="margin-bottom: 0px; padding-top: 1px; width: 75px;"><input
style="border: 0px none ; padding-top: 2px; padding-bottom: 2px; height: 20px; font-size: 9pt; color: black;"
size="10" name="Time"></form>
Die Uhrzeitsanzeige endet hier.
</td>
</tr>
</tbody>
</table>
</body>
</html>
Der Quelltext ist wie gesagt der Orginaltext, wenn ihr die rote Schrieft raus macht und das in ein HTML Text macht indem ihr da alles mit dem Text ersetzt bekommt ihr die Anzeige oben im Bild.
|
Folgende User sind hier gerade aktiv:
-
-