SVG – Learning by Coding

[ digitaluhr.svg --> Grafik anzeigen ]

 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: <!--    AuthorDrThomas 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-familymonospace;
24:         font-weightbold;
25:       }
26: 
27:       text.t1
28:       {
29:         fill#F00;
30:         font-size24px;
31:       }
32: 
33:       text.t2
34:       {
35:         fill#090;
36:         font-size36px;
37:       }
38: 
39:       text.headline
40:       {
41:         font-familysans-serif;
42:         font-size24px;
43:         font-weightnormal;
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]