Autor Nachricht
GrayGhost
BeitragVerfasst am: 11.08.2007, 19:54    Titel: Datum und Uhrzeit für die Homepage

Datum und Uhrzeit für die Homepage

Dieses Javascript dient zur Anzeige der Uhrzeit, des Datums sowie des Wochentags. Ich habe den Code ausführlich durch Kommentare dokumentiert. Der Bodybereich zeigt, wie du die Informationen auf deiner Homepage ausgeben kannst. Ich möchte an dieser Stelle keine Anleitung zu HTML Tags geben. Dies wird in weiteren Artikeln geschehen. An dieser Stelle möchte ich nur die Angaben innerhalb der SPAN Tags erklären.

ID: legt fest, welcher Wert innerhalb des SPAN Tags angezeigt wird.
STYLE:
http://de.selfhtml.org/css/eigenschaften/schrift.htm
http://de.selfhtml.org/css/eigenschaften/positionierung.htm

VISIBILITY: Möglich sind "visible" und "hidden". Legt fest, ob die Ausgabe sichtbar oder unsichtbar ist. Du kannst darüber z.B. Die Ausgabe des Wochentags ausschalten, ohne das SPAN Tag zu entfernen.



Code:
<html>
<HEAD>
<TITLE>ActiZeit</TITLE>

<SCRIPT language=JavaScript>

function clock() {

   var Zeit   = new Date();
   var Stunden   = Zeit.getHours();
   var Minuten   = Zeit.getMinutes();
   var Sekunden   = Zeit.getSeconds();
   var Tag      = Zeit.getDate();
   var Monat   = Zeit.getMonth()+1;
   var Jahr   = Zeit.getFullYear();
   var Wochentag   = Zeit.getDay();

//Definition der Wochentage. Wenn du lieber Sonnabend in der Anzeige haben willst, oder eine andere Sprache wünscht, dann ändere dieses Array
   var Wochentage = new Array ("Sonntag","Montag","Dienstag","Mittwoch","Donnerstag","Freitag","Samstag");
   
//Ab Mitternacht, bis 1:00 Uhr werden zwei Nullen angezeigt
   if (Stunden == 0) Stunden = "00";
   
//Sind die Stunden einstellig, so wird eine führende 0 eingefügt
   if (Stunden <= 9 && Stunden != "00") Stunden = "0" + Stunden;
   
//Sind die Minuten einstellig, so wird eine führende 0 eingefügt
   if (Minuten <= 9) Minuten = "0" + Minuten;
   
//Sind die Sekunden einstellig, so wird eine führende 0 eingefügt
   if (Sekunden <= 9) Sekunden = "0" + Sekunden;
   
//Ist der Tag einstellig, so wird eine führende 0 eingefügt
   if (Tag <= 9) Tag = "0" + Tag;
   
//Ist der Monat einstellig, so wird eine führende 0 eingefügt
   if (Monat <= 9) Monat = "0" + Monat;

//Stunden, Minuten und Sekunden werden durch einen Doppelpunkt geteilt   
   var TZeit = Stunden + ":" + Minuten + ":" + Sekunden;
   
//Tag, Monat und hahr werden durch einen Punkt geteilt   
   var TDatum = Tag + "." + Monat + "." + Jahr;

//Hier gibt es keine besondere Definition
   var TTag = Wochentage[Wochentag];

//Hier werden die Namen für die ID Tags des HTML Bodys festgelegt
   Uhrzeit.innerHTML = TZeit;
   Datum.innerHTML = TDatum;
   WTag.innerHTML = TTag;

//Definition der Update Zeit. 1000 bedeutet 1000 Millisekunden. Damit wird die Uhr jede Sekunde aktualisiert
   setTimeout("clock()", 1000);

   }

 </SCRIPT>
</HEAD>

<BODY style="BACKGROUND-IMAGE: none; CURSOR: default; BACKGROUND-COLOR: #cccc00" scroll=no onload=clock()>

<SPAN id=Uhrzeit style="FONT-WEIGHT: bold; FONT-SIZE: 20px; LEFT: 15px; VISIBILITY: visible; COLOR: #666666; FONT-STYLE: normal; FONT-FAMILY: Tahoma; POSITION: absolute; TOP: 5px">12:53:51</SPAN>

<SPAN id=Datum style="FONT-WEIGHT: normal; FONT-SIZE: 20px; LEFT: 15px; VISIBILITY: visible; COLOR: #666666; FONT-STYLE: normal; FONT-FAMILY: Tahoma; POSITION: absolute; TOP: 35px">20.03.2003</SPAN>

<SPAN id=WTag style="FONT-WEIGHT: normal; FONT-SIZE: 20px; LEFT: 15px; VISIBILITY: visible; COLOR: #666666; FONT-STYLE: normal; FONT-FAMILY: Tahoma; POSITION: absolute; TOP: 65px">Donnerstag</SPAN>

</BODY>
</html>


MfG
Erhard Olszok aka GrayGhost

Powered by phpBB © 2001, 2005 phpBB Group