Animationen per Skript starten
(Auszug aus "Das Einsteigerseminar SVG — Webgrafiken mit XML" von Helma Spona)
Auch Animationen können Sie ganz einfach mit einem Mausklick starten. Zwar können Sie Animationen auch direkt über JavaScript steuern, aber noch einfacher ist es, eine Animation zu definieren und über einen einfachen Hyperlink zu starten. Das zeigt eine Abwandlung des ersten Beispiels in diesem Kapitel. Für den Button, der beim Hovern die Farbe wechselt, wird außerdem eine Animation definiert. Sie sorgt dafür, dass der Kreis bis auf einen Radius von einem Pixel verkleinert wird. Wichtig ist dazu, dass für das Attribut begin der Wert indefinite angegeben wird. Alle anderen Parameter müssen so definiert sein, dass die Animation funktioniert.
Hinweis:
Am besten testen Sie die Animation zunächst, indem Sie einen Wert von 1s für das Attribut begin festlegen. Erst wenn die Animation an sich funktioniert, ist sicher, dass es am Aufruf oder Start liegt, falls sie später nicht klappt.
Zum Start der Animation genügt dann ein <a>-Tag für dessen xlink:href-Attribut Sie den Namen der Animation festlegen, den Sie über das id-Attribut des <animate>-Tags definiert haben.
<a xlink:href="#animieren" >
<circle onmouseover="farbeAendern(evt)" onmouseout="farbeAendern(evt)" cx="100" cy="100" r="20" style="fill:red">
<animate id="animieren" attributeName="r" begin="indefinite" from="20" to="1" by="-1" dur="5s" fill="freeze"/>
</circle>
</a>
| Tipp der data2type-Redaktion: Zum Thema SVG bieten wir auch folgende Schulungen zur Vertiefung und professionellen Fortbildung an: |
Copyright © verlag moderne industrie GmbH 2001
Für Ihren privaten Gebrauch dürfen Sie die Online-Version ausdrucken.
Ansonsten unterliegt dieses Kapitel aus dem Buch "Das Einsteigerseminar SVG — Webgrafiken mit XML" denselben Bestimmungen wie die gebundene Ausgabe: Das Werk einschließlich aller seiner Teile ist urheberrechtlich geschützt. Alle Rechte vorbehalten einschließlich der Vervielfältigung, Übersetzung, Mikroverfilmung sowie Einspeicherung und Verarbeitung in elektronischen Systemen.
verlag moderne industrie GmbH, Justus-von-Liebig-Straße 1, D-86899 Landsberg/Lech, fon ++49 (0) 81 91 / 125 – 0, leserservice(at)mi-verlag.de