analoge Mausuhr 01
    
WWW.WEB-TOOLBOX.NET
  ScriptCode ZURÜCK SITEMAP  

 Analoge Uhr am Mauszeiger 01

Querverweis Analoge Mausuhr 02 (mit Kalender, alle Browser)

Eine dynamische, analoge Uhr mit 12-Stunden Zeitanzeige von Kurt Grigg. Funktioniert nicht in allen Browsern, eignet sich für unterschiedliche Anwendungen.

Die Werte für die aktuelle Zeit werden der Systemzeit des lokalen Rechners entnommen. Eine Abfrage im Sekundentakt aktuallisiert die Anzeige. Den Sekunden-, Minuten und Stundenwerten werden die entsprechenden Positionen neben dem Mauszeiger zugeordnet und dort werden kleine, farbige Pixel oder Texte (Zahlen) angezeigt. Mit der Bewegung des Mauszeigers werden diese Positionen neu berechnet.

Alternative Darstellungen sind durch Austausch der Farben und Änderung der Größenangaben möglich. Ihrer Phantasie sind da keine Grenzen gesetzt.


  Aufwand:

Das JavaSript (140 Zeilen) in den Body-Bereich ihres HTML-Dokuments kopieren (am Ende des HTML-Dokuments, vor dem </body>-Tag). Den Quellcode entnehmen sie der Textdatei (Link zum Öffnen des Fensters oben unter 'Scriptcode').


  Änderungen / Anpassungen

 Farben

  • Ziffernfarbe
  • Punktfarbe
  • Farbe Stundenzeiger
  • Farbe Minutenzeiger
  • Farbe Sekundenzeiger


Im Quellcode: 
fCol='#0000FF'; // Ziffernfarbe
dCol='#00C070'; // Punktfarbe
hCol='#DF0000'; // Stundenzeiger Farbe
mCol='#000000'; // Minutenzeiger Farbe
sCol='#FF00FF'; // Sekundenzeiger Farbe
Zur Anpassung der Farben im Script:

Element   Variable  hier im Beispiel   ersetzen mit  
Ziffernfarbe fCol #0000FF (blau) HTML-Farbwert
Punktfarbe dCol #00C070 (grün) HTML-Farbwert
Stundenzeiger hCol #DF0000 (rot) HTML-Farbwert
Minutenzeiger mCol #000000 (schwarz) HTML-Farbwert
Sekundenzeiger sCol #FF00FF (pink) HTML-Farbwert



 Position und Größe

  • Höhe
  • Breite
  • Abstand Y
  • Abstand X


Im Quellcode: 
ClockHeight=35;
ClockWidth=35;
ClockFromMouseY=80;
ClockFromMouseX=5;
Zur Anpassung der Werte im Script:

Element   Variable  hier im Beispiel   ersetzen mit  
Höhe ClockHeight 35 Wert in Pixel
Breite ClockWidth 35 Wert in Pixel
Abstand Y-Achse ClockFromMouseY 80 Wert in Pixel
Abstand X-Achse ClockFromMouseX 5 Wert in Pixel


Für den Abstand können sie auch negative Werte eintragen z.B. -100 .


Eine Mausuhr mit Kalender, die auch im FF und Opera funktioniert finden sie unter analoge Mausuhr 02.








NACH OBEN