Source de tp4bis.html
1: <!DOCTYPE html>
2: <html lang="fr">
3: <head>
4: <title>Actions utilisateur et JavaScript</title>
5: <meta charset="utf-8" />
6: <link rel="stylesheet" href="idemm.css" />
7: <script>
8: var mesphotos = ['chat.jpg','chien.jpg','sanglier.jpg','lapin.jpg'];
9: var image_en_cours = 0;
10: function suivante () {
11: image_en_cours = image_en_cours + 1;
12: if (image_en_cours == mesphotos.length) {
13: image_en_cours = 0;
14: }
15: document.getElementById('ecran').src = 'images/'+mesphotos[image_en_cours];
16: }
17: function precedente () {
18: image_en_cours = image_en_cours - 1;
19: if (image_en_cours < 0) {
20: image_en_cours = mesphotos.length-1;
21: }
22: document.getElementById('ecran').src = 'images/'+mesphotos[image_en_cours];
23: }
24: </script>
25: </head>
26:
27: <body>
28:
29: <h1>Actions utilisateur et JavaScript</h1>
30:
31: <h2>Diaporama manuel</h2>
32:
33: <div class="illustration">
34: <img id="ecran" src="images/chat.jpg" alt="un chat" height="200" />
35: </div>
36:
37: <button onclick="precedente();">image précédente</button>
38: <button onclick="suivante();">image suivante</button>
39:
40: </body>
41: </html>
42: