justement le chargement de l'animation...
~~~~~~~ { .html }
-<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>
~~~~~~~
}
</script>
-<div id="anim3" style="margin:10px auto;padding:10px;width:354px;border:2px solid #AAA;border-radius:4px">
+<div id="anim3" 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 class="message" id="anim3_message">Ellipsographe</div>
<div id="anim3_boutons"><button onclick="charge_anim3()">Charger l'animation</button></div>
## Exemples d'utilisation
+
+<div class="row">
+ <div class="col-md-4">
+ <a href="//melusine.eu.org/syracuse/G/svganimation-exemples/mvtretrograde/"
+ alt="lien vers l'exemple"><img src="img/mvtretrograde.png"
+ alt="Image de l'exemble" style="width: 100%;"/></a>
+</div>
+ <div class="col-md-8">
+ 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.
+</div>
+</div>