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: <!-- experimentelle DTD-Erweiterung by TM 2004 -->
6: <!ATTLIST svg xmlns:a CDATA #FIXED "http://ns.adobe.com/AdobeSVGViewerExtensions/3.0/">
7: <!ENTITY % svgExt "|a:video">
8: <!ELEMENT a:video EMPTY>
9: <!ATTLIST a:video
10: x CDATA #IMPLIED y CDATA #IMPLIED width CDATA #REQUIRED height CDATA #REQUIRED
11: volume CDATA #IMPLIED pan CDATA #IMPLIED begin CDATA #IMPLIED end CDATA #IMPLIED
12: fill CDATA #IMPLIED xlink:href CDATA #REQUIRED>
13: ]>
14:
15: <!-- SVG - Learning by Coding - http://www.datenverdrahten.de/svglbc/ -->
16: <!-- Author: Dr. Thomas Meinike 05/04 - thomas@handmadecode.de -->
17:
18: <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"
19: xmlns:a="http://ns.adobe.com/AdobeSVGViewerExtensions/3.0/" zoomAndPan="disable">
20:
21: <title>SVG - Learning by Coding</title>
22: <desc>SVG-Spezifikation in Beispielen</desc>
23: <text x="20" y="30" style="fill: #000; font-size: 24px">
24: Element a:video (ASV 6 / DirectX 8+)</text>
25: <text x="20" y="50">[sonst erscheint keine Ausgabe]</text>
26: <a xlink:href="bilder/video.gif" target="svgbox">
27: <text x="270" y="50" style="fill: #F00">Ergebnis als Rastergrafik ...
28: <set attributeName="fill" attributeType="CSS" to="#00C" begin="mouseover"/>
29: <set attributeName="fill" attributeType="CSS" to="#F00" begin="mouseout"/>
30: </text>
31: </a>
32:
33: <!-- Abspielflaeche mit Text -->
34: <rect x="139" y="79" width="162" height="122" rx="5" style="stroke: #000; fill: #EEE"/>
35: <text x="170" y="150" style="fill: #00C; font-size: 28px; font-weight: bold;
36: pointer-events: none">SVG.TV</text>
37:
38: <!-- Video-Einbindung -->
39: <a:video x="140" y="80" width="160" height="120" xlink:href="audvid/svgtv.avi"
40: begin="start.click" end="stopp.click" fill="freeze"/>
41:
42: <!-- Start-Button -->
43: <polygon id="start" points="190,230 190,210 210,220" style="fill: #0C0">
44: <set attributeName="opacity" attributeType="CSS" to="0.5" begin="mouseover"/>
45: <set attributeName="stroke" attributeType="CSS" to="#000" begin="mouseover"/>
46: <set attributeName="opacity" attributeType="CSS" to="1.0" begin="mouseout"/>
47: <set attributeName="stroke" attributeType="CSS" to="none" begin="mouseout"/>
48: </polygon>
49:
50: <!-- Stopp-Button -->
51: <rect id="stopp" x="235" y="211" width="18" height="18" style="fill: #E00">
52: <set attributeName="opacity" attributeType="CSS" to="0.5" begin="mouseover"/>
53: <set attributeName="stroke" attributeType="CSS" to="#000" begin="mouseover"/>
54: <set attributeName="opacity" attributeType="CSS" to="1.0" begin="mouseout"/>
55: <set attributeName="stroke" attributeType="CSS" to="none" begin="mouseout"/>
56: </rect>
57:
58: </svg>
[zum Anfang]