SVG – Learning by Coding
1: <?xml version="1.0" encoding="ISO-8859-1" standalone="no"?>
2: <!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.0//EN"
3: "http://www.w3.org/TR/2001/REC-SVG-20010904/DTD/svg10.dtd" [
4: <!ATTLIST svg xmlns:xlink CDATA #FIXED "http://www.w3.org/1999/xlink">
5: ]>
6:
7: <!-- SVG - Learning by Coding - http://www.datenverdrahten.de/svglbc/ -->
8: <!-- Author: Dr. Thomas Meinike 02/03 - thomas@handmadecode.de -->
9:
10: <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"
11: onload="Init(evt)">
12:
13: <title>SVG - Learning by Coding</title>
14: <desc>SVG-Spezifikation in Beispielen</desc>
15:
16: <defs>
17:
18: <style type="text/css">
19: <![CDATA[
20:
21: text
22: {
23: font-family: monospace;
24: font-weight: bold;
25: }
26:
27: text.t1
28: {
29: fill: #F00;
30: font-size: 24px;
31: }
32:
33: text.t2
34: {
35: fill: #090;
36: font-size: 36px;
37: }
38:
39: text.headline
40: {
41: font-family: sans-serif;
42: font-size: 24px;
43: font-weight: normal;
44: fill: #000;
45: }
46:
47: ]]>
48: </style>
49:
50: <script type="text/javascript">
51: <![CDATA[
52:
53: var svgdoc,text1,text2;
54:
55:
56: function Init(load_evt)
57: {
58: svgdoc=load_evt.target.ownerDocument;
59: text1=svgdoc.getElementById("datum");
60: text2=svgdoc.getElementById("zeit");
61: Datum_Uhrzeit();
62: }
63:
64:
65: function Datum_Uhrzeit()
66: {
67: var datumzeit,temp,datum,zeit;
68:
69: datumzeit=new Date().toLocaleString();
70: temp=datumzeit.lastIndexOf(" ");
71: datum=datumzeit.substring(0,temp);
72: zeit=datumzeit.substring(temp+1,datumzeit.length);
73: text1.firstChild.nodeValue=datum;
74: text2.firstChild.nodeValue=zeit;
75: setTimeout("Datum_Uhrzeit()",1000);
76: }
77:
78: ]]>
79: </script>
80:
81: </defs>
82:
83: <text class="headline" x="20" y="30">Digitaluhr mit JavaScript</text>
84:
85: <text id="datum" class="t1" x="20" y="80"> </text>
86: <text id="zeit" class="t2" x="20" y="120"> </text>
87:
88: </svg>
[zum Anfang]