<div id="anim2"
- style="margin:10px auto;padding:10px;width:354px;border:2px solid #AAA;border-radius:4px">
- <img src="../ellipsographe/svg/ellipsographe-1.svg" alt="animation1" style="width:330px;height:240px"/>
+<div id="anim2" style="...">
+ <img src="../ellipsographe/svg/ellipsographe-1.svg" alt="animation1" style="..."/>
<div class="message" id="anim2_message">Ellipsographe</div>
- <div id="anim2_boutons"><button onclick="charge_anim2();">Charger l'animation</button></div>
+ <div id="anim2_boutons">
+ <button onclick="charge_anim2();">Charger l'animation</button>
+ </div>
</div>
Dans le même temps, le style des éléments englobants a été adapté.
@@ -232,6 +233,29 @@ Charger l'animation
Le fichier SVGPlayerOne.js est fourni à la racine du projet SVGAnimation.
Exemples d'utilisation
+
+
+
+
+
+Animation avec le player SVGPlayerButtons et une factorisation avec MetaPost du matériel qui se répète sur chaque image. Le fond est mis en background de la balise englobante, permettant ainsi d'alléger l'animation.
+
+
+
+
+
+
+
+Fabrication de l'animation à partir d'un fichier PDF transformé en fichiers SVG grâce au programme pdf2svg.
+Animation avec le player SVGPlayerButtons. L'animation est une animation de construction d'un maillage, le contrôle se fait donc image par image.
+Le player est donc paramétré pour n'afficher que les boutons de début et fin d'animation, ainsi que l'avance et le recule image par image.
+L'affichage des boutons est personnalisé grâce à du code CSS.
+
+