Java Skript-Uhr
Quelle: 3quarks.com/de/Bahnhofsuhr/index.html
JavaScript CodeDer unten stehende JavaScript Code wird automatisch aus den Einstellungen des Abschnitts „Eigene Bahnhofsuhr“ generiert. Du kannst so Deine eigene Bahnhofsuhr zusammenklicken und anschließend den erzeugten Source Code einfach kopieren.
Die ersten drei Zeilen sind nur für den Internet Explorer bis zur Version 8 interessant. Sie binden die JavaScript-Bibliothek excanvas.js über einen bedingten Kommentar ein; andere Browser ignorieren diese Anweisung.
Das Script geht davon aus, daß sich die beiden JavaScript-Bibliotheken station-clock.js und excanvas.js im gleichen Verzeichnis wie die HTML-Seite mit dem <canvas>-Tag befinden. Ist dies bei Dir nicht der Fall, dann mußt Du die beiden Pfadangaben entsprechend ändern.
Weiter geht das Script davon aus, daß Du auf der HTML-Seite als <canvas> id den Namen clock verwendest. Wenn Du eine andere id bevorzugen, dann mußt Du auch hier den Source Code anpassen.
Quelle: 3quarks.com/de/Bahnhofsuhr/index.html
JavaScript CodeDer unten stehende JavaScript Code wird automatisch aus den Einstellungen des Abschnitts „Eigene Bahnhofsuhr“ generiert. Du kannst so Deine eigene Bahnhofsuhr zusammenklicken und anschließend den erzeugten Source Code einfach kopieren.
Die ersten drei Zeilen sind nur für den Internet Explorer bis zur Version 8 interessant. Sie binden die JavaScript-Bibliothek excanvas.js über einen bedingten Kommentar ein; andere Browser ignorieren diese Anweisung.
Das Script geht davon aus, daß sich die beiden JavaScript-Bibliotheken station-clock.js und excanvas.js im gleichen Verzeichnis wie die HTML-Seite mit dem <canvas>-Tag befinden. Ist dies bei Dir nicht der Fall, dann mußt Du die beiden Pfadangaben entsprechend ändern.
Weiter geht das Script davon aus, daß Du auf der HTML-Seite als <canvas> id den Namen clock verwendest. Wenn Du eine andere id bevorzugen, dann mußt Du auch hier den Source Code anpassen.
Source Code
- <!--[if lt IE 9]>
- <script type="text/javascript" src="excanvas.js"></script>
- <![endif]-->
- <script type="text/javascript" src="station-clock.js"></script>
- <script type="text/javascript">
- var clock = new StationClock("clock");
- clock.body = StationClock.SquareBody;
- clock.dial = StationClock.GermanStrokeDial;
- clock.hourHand = StationClock.PointedHourHand;
- clock.minuteHand = StationClock.PointedMinuteHand;
- clock.secondHand = StationClock.HoleShapedSecondHand;
- clock.boss = StationClock.RedBoss;
- clock.minuteHandBehavoir = StationClock.CreepingMinuteHand;
- clock.secondHandBehavoir = StationClock.OverhastySecondHand;
- window.setInterval(function() { clock.draw() }, 50);
- </script>