SVG – Learning by Coding

[ get_setCurrentTime.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 07/04 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.lz
 28:       {
 29:         fill#090;
 30:         font-size24px;
 31:       }
 32: 
 33:       text.headline
 34:       {
 35:         font-familysans-serif;
 36:         font-size24px;
 37:         font-weightnormal;
 38:         fill#000;
 39:       }
 40: 
 41:       a text
 42:       {
 43:         fill#00C;
 44:         font-size14px;
 45:       }
 46: 
 47:     ]]>
 48:     </style>
 49: 
 50:     <script type="text/javascript">
 51:       <![CDATA[
 52: 
 53:       var svgdoc,svgroot,laufzeit;
 54: 
 55: 
 56:       function Init(load_evt)
 57:       {
 58:         svgdoc=load_evt.target.ownerDocument;
 59:         svgroot=svgdoc.documentElement;
 60:         laufzeit=svgdoc.getElementById("laufzeit");
 61:         if(!window.XML)setInterval("Laufzeit()",1000);
 62:       }
 63: 
 64: 
 65:       function Laufzeit()
 66:       {
 67:         var curtime,std,min,sek;
 68: 
 69:         curtime=svgroot.getCurrentTime();
 70: 
 71:         sek=curtime;
 72:         std=Math.floor(sek/3600);
 73:         sek-=std*3600;
 74:         min=Math.floor(sek/60);
 75:         sek-=min*60; 
 76:         sek=Math.floor(sek);
 77: 
 78:         std=(std<10)?"0"+std:std;
 79:         min=(min<10)?"0"+min:min;
 80:         sek=(sek<10)?"0"+sek:sek;
 81: 
 82:         laufzeit.firstChild.data=std+":"+min+":"+sek;
 83:       }
 84: 
 85: 
 86:       function ZeitSetzen(t)
 87:       {
 88:         if(!window.XML)svgroot.setCurrentTime(t);
 89:       }
 90: 
 91:       ]]>
 92:     </script>
 93: 
 94:   </defs>
 95: 
 96:   <text class="headline" x="20" y="30">
 97:     Die Methoden getCurrentTime() bzwsetCurrentTime()</text>
 98: 
 99:   <text x="20" y="60">Laufzeit des aktuellen Scripts:</text>
100:   <text id="laufzeit" class="lz" x="20" y="90">00:00:00</text>
101: 
102:   <a xlink:href="" cursor="pointer" onclick="return false">
103:     <text x="20" y="120" onclick="ZeitSetzen(0)">
104:      <set attributeName="fill" attributeType="CSS" to="#F00" begin="mouseover"/>
105:      <set attributeName="fill" attributeType="CSS" to="#00C" begin="mouseout"/>
106:      Zeit auf 00:00:00 setzen
107:     </text>
108:   </a>
109: 
110:   <a xlink:href="" cursor="pointer" onclick="return false">
111:     <text x="250" y="120" onclick="ZeitSetzen(5415)">
112:      <set attributeName="fill" attributeType="CSS" to="#F00" begin="mouseover"/>
113:      <set attributeName="fill" attributeType="CSS" to="#00C" begin="mouseout"/>
114:      Zeit auf 01:30:15 setzen
115:     </text>
116:   </a>
117: 
118: </svg>

[zum Anfang]