ANWENDUNGSBEISPIEL

Das Beispiel auf dieser Seite zeigt in einem kleinen Feld laufend an, wie viele Minuten und Sekunden seit dem Aufruf der Seite verstrichen sind.
Gedacht ist die Anzeige des Feldes vor allem für HTML-Dateien, die innerhalb eines Frame-Fensters ständig angezeigt bleiben, etwa in einem Frame-Fenster mit einem Logo oder mit Verweisen.

In Ergänzung zum Originalscript des Autoren Stefan Münz habe ich für das Ausgabefenster einige Formatierungsmöglichkeiten eingebaut.
Der Nachteil dabei: Nicht jeder Browser kann dies interpretieren. Das ist jedoch nicht so problematisch, denn in diesem Fall wird einfach das 'Standard'fenster angezeigt.




Zurück zur Script-Auswahl oder dieses Script-Archiv laden?


EINBINDUNG DES SCRIPTS IN DEINE HOMEPAGE:
Falls Du das Script-Archiv bereits geladen hast, so brauchst Du jetzt nicht mehr weiterzulesen. Das Archiv enthält auch diese Beispieldatei (stoppuhr.html) und kann deshalb Offline durchgesehen werden.

  • Das vorliegende Script besteht aus zwei Teilen: 1. Einem Java-Script im HEAD-Bereich. 2. Einem Ausgabefeld für die Zeitanzeige im BODY-Bereich.
  • Das JAVA-Script für den "HEAD"-Teil sieht folgendermaßen aus: (Groß- und Kleinschreibung muß beachtet werden!) <META http-equiv="Content-Script-Type" content="text/javascript"> <script type="text/javascript"> <!-- Start JavaScript - var Jetzt = new Date(); var Start = Jetzt.getTime(); function ZeitAnzeigen() { var absSekunden = Math.round(ZeitBerechnen()); var relSekunden = absSekunden % 60; var absMinuten = Math.abs(Math.round((absSekunden-30)/60)); var anzSekunden ="" + ((relSekunden > 9) ? relSekunden : "0" + relSekunden); var anzMinuten ="" + ((absMinuten > 9) ? absMinuten : "0" + absMinuten); window.document.Anzeige.Zeit.value = anzMinuten + ":" + anzSekunden; window.setTimeout('ZeitAnzeigen()',1000); } function ZeitBerechnen() { var Immernoch = new Date(); return((Immernoch.getTime() - Start)/1000); } window.onLoad=window.setTimeout('ZeitAnzeigen()',1000) //Im Originalscript steht der Event-Handler im Body-Tag // - Ende JavaScript - --> </script>
  • Das Ausgabefeld für die Zeitanzeige im BODY-Bereich sieht folgendermaßen aus: <form action="" name="Anzeige"> <input size="7" name="Zeit" value="00:00"> </form> Zur Zeitanzeige wird hier ein Formulareingabefeld als Ausgabefeld zweckentfremdet. Es wird mit dem Wert 00:00 vorbelegt, damit auch in der ersten Sekunde schon etwas in dem Feld steht.
  • Hinweise zur individuellen Anpassung Ganz einfach: Es braucht nichts angepasst werden. Du kopierst die beiden Teile wie vorgesehen in Deine HTML-Seite. Solltest Du das Ausgabefeld wie in meinem Beispiel noch nach eigenem Geschmack formatieren wollen, so kannst Du das mit Hilfe von CSS-Befehlen machen. Meine Zusätze findest Du in rot: <form action="" name="Anzeige" style="width:75px; BORDER-LEFT:#0399fd 7px solid; BORDER-TOP:#0381d6 7px solid; BORDER-RIGHT:#034876 7px solid; BORDER-BOTTOM:#0369ac 7px solid;"> <input size="7" name="Zeit" value="00:00" style="width:75px; color:#ffffff; background-color:#000080; font-size:14pt; font-family:Arial,sans-serif; text-align:right;"> </form> Alle Farbwerte müssen im hexadezimalen Farbwert angegeben werden. Falls Du Dich damit nicht auskennst, so besuch doch einfach mal die Scriptseite "Systemdaten" im Café Espresso. Hier findest Du im Menüpunkt "FarbHexcode" eine Zusammenstellung der gebräuchlichen Farbwerte. Die Bedeutung der Parameter erklären sich aus den Namen. Solltest Du damit nicht klarkommen, so gibt es auch hier eine Hilfe. Stefan Münz ist nicht nur der Autor dieses Scripts, er hat auch eine umfangreiche Hilfe für uns HomePage-Bastler geschrieben (SELFHTML). Du kannst diese Seiten kostenlos von seiner WebSite laden. Ein Wort dazu: Auf den ersten Blick ist die dort angebotene Informationsfülle verwirrend. Die Seiten sind insofern für 'Newbies' vielleicht nicht optimal. Falls Du Dich aber mit HTML schon ein bisschen auskennst findest Du in SELFHTML nach kurzer Eingewöhnungszeit alle Tags und Parameter, an die Du Dich gerade nicht erinnern kannst. Das gilt sowohl für HTML/XHTML als auch für CSS Style-Sheets, XML/DTDs, JavaScript/DOM, Dynamisches HTML, CGI/Perl und PHP!

Der Autor ist Stefan Münz
Auf seiner HomePage http://selfaktuell.teamone.de findest Du sein 'Lehrbuch' SELFHTML und viele weitere Hilfen.