2 <script src=
"https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
3 <script type=
"text/javascript" src=
"../SVGAnimation.js"></script>
4 <script type=
"text/javascript" src=
"../SVGPlayerOne.js"></script>
5 <script type=
"text/javascript">
6 function charge(i,p,a,b,t) {
7 var anim = new Animation(i,p,a,b,t);
11 <p><strong>Participants :
</strong> Chupin Maxime, Sarlat Jean-Michel.
</p>
12 <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>
13 <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>
14 <h2 id=
"installation">Installation
</h2>
15 <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>
16 <pre><code><script src=
"https://ajax.googleapis.com/ajax/libs/jquery/
1.11.2/jquery.min.js
"></script
>
17 <script type=
"text/javascript
" src=
"js/SVGAnimation.js
"></script
></code></pre>
18 <p>La librairie
<code>SVGAnimation.js
</code> d
épend de
<code>JQuery
</code>, il faut donc charger charger cette biblioth
èque JavaScript avant.
</p>
19 <h2 id=
"lobjet-animation">L'objet
<code>Animation
</code></h2>
20 <div id=
"anim1" style=
"margin:10px auto;padding:10px;width:660px;border:2px solid #AAA;border-radius:4px">
21 <img src=
"../ellipsographe/svg/ellipsographe-1.svg" alt=
"animation1" style=
"width:660px;height:480px"/>
22 <div id=
"anim1_message" class=
"message">
25 <div id=
"anim1_boutons">
26 <button onclick=
"charge('anim1','../ellipsographe/svg/ellipsographe-',1,91,'boutons');">
31 <h3 id=
"les-paramètres">Les param
ètres
</h3>
32 <h2 id=
"les-players">Les
<em>players
</em></h2>
33 <h3 id=
"svgplayerone.js"><code>SVGPlayerOne.js
</code></h3>
34 <h3 id=
"svgplayerbuttons.js"><code>SVGPlayerButtons.js
</code></h3>
36 <div id=
"TDM" class=
"tdm">
37 <div style=
"text-align:center">
38 <a href=
"javascript:tdmgauche();">←</a> <b>Sections
</b> <a href=
"javascript:tdmdroite();">→</a>
41 <li><a href=
"#installation">Installation
</a></li>
42 <li><a href=
"#lobjet-animation">L'objet
<code>Animation
</code></a><ul>
43 <li><a href=
"#les-paramètres">Les param
ètres
</a></li>
45 <li><a href=
"#les-players">Les
<em>players
</em></a><ul>
46 <li><a href=
"#svgplayerone.js"><code>SVGPlayerOne.js
</code></a></li>
47 <li><a href=
"#svgplayerbuttons.js"><code>SVGPlayerButtons.js
</code></a></li>
51 <div style=
"clear:both"></div>