2 <script type=
"text/javascript" src=
"../SVGAnimation.js"></script>
3 <script type=
"text/javascript" src=
"../SVGPlayerOne.js"></script>
4 <script type=
"text/javascript">
5 function charge(i,p,a,b) {
6 var anim = new Animation(i,p,a,b);
10 <p><strong>Participants :
</strong> Chupin Maxime, Sarlat Jean-Michel.
</p>
11 <p><strong>Interface du d
ép
ôt Git :
</strong> <a href=
"http://melusine.eu.org/syracuse/G/git/?p=svganimation.git;a=summary" class=
"uri">http://melusine.eu.org/syracuse/G/git/?p=svganimation.git;a=summary
</a></p>
12 <p>L'objectif est de d
évelopper, en particulier, du code Javascript afin de pr
ésenter des animations de fichiers SVG produits, en particulier, par MetaPost. Ce d
éveloppement n'
étant pas tout
à fait pr
éd
étermin
é, il sera constitu
é à partir de l'exploration de diff
érents sc
énarios de pr
ésentation de ces animations et des modes de construction des fichiers SVG.
</p>
13 <h2 id=
"installation">Installation
</h2>
14 <p>Le fichier
<code>SVGAnimation.js
</code> (que l'on supposera dans le r
épertoire
<code>js
</code>) est
à charger dans la page
<code>html
</code> en mettant les lignes suivantes :
</p>
15 <pre><code><script src=
"https://ajax.googleapis.com/ajax/libs/jquery/
1.11.2/jquery.min.js
"></script
>
16 <script type=
"text/javascript
" src=
"js/SVGAnimation.js
"></script
></code></pre>
17 <p>La librairie
<code>SVGAnimation.js
</code> d
épend de
<code>JQuery
</code>, il faut donc charger charger cette biblioth
èque JavaScript avant.
</p>
18 <h2 id=
"lobjet-animation">L'objet
<code>Animation
</code></h2>
19 <div id=
"anim1" style=
"margin:10px auto;padding:10px;width:370px;border:2px solid #AAA;border-radius:4px">
20 <img src=
"../ellipsographe/svg/ellipsographe-1.svg" alt=
"animation1" style=
"width:330px;height:240px"/>
21 <div id=
"anim1_message" class=
"message">
24 <div id=
"anim1_boutons">
25 <button onclick=
"charge('anim1','../ellipsographe/svg/ellipsographe-',1,91);">
30 <h3 id=
"les-paramètres">Les param
ètres
</h3>
31 <h2 id=
"les-players">Les
<em>players
</em></h2>
32 <h3 id=
"svgplayerone.js"><code>SVGPlayerOne.js
</code></h3>
33 <h3 id=
"svgplayerbuttons.js"><code>SVGPlayerButtons.js
</code></h3>
35 <div id=
"TDM" class=
"tdm">
36 <div style=
"text-align:center">
37 <a href=
"javascript:tdmgauche();">←</a> <b>Sections
</b> <a href=
"javascript:tdmdroite();">→</a>
40 <li><a href=
"#installation">Installation
</a></li>
41 <li><a href=
"#lobjet-animation">L'objet
<code>Animation
</code></a><ul>
42 <li><a href=
"#les-paramètres">Les param
ètres
</a></li>
44 <li><a href=
"#les-players">Les
<em>players
</em></a><ul>
45 <li><a href=
"#svgplayerone.js"><code>SVGPlayerOne.js
</code></a></li>
46 <li><a href=
"#svgplayerbuttons.js"><code>SVGPlayerButtons.js
</code></a></li>
50 <div style=
"clear:both"></div>