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]