Diaporama javascript

Logiciel & apps Programmation
1

Bonjour,
Je débute en javascript et j’ai vraiment du mal à comprendre la logique du javascript.
Je dois effectuer un diaporama avec les fonction suivant et precedent qui, en cliquant dessus passe a l’image précédente (pour précédent) et suivante (pour suivant) mais je ne sais pas comment commencer…quelqu’un pourrait il m’aider à savoir comment débuter et surtout à comprendre!
voici mon code HTML:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" lang="fr">
  <head>
      <title>Diaporama</title>
      <script type="text/javascript" src="diaporama.js" />
  </head>
  <body>
    <h1>Diaporama, pour afficher la 1ere image cliquez sur suivant</h1>
    <div>
      <img src="" alt="diaporama" id="diaporama" />
    </div>
    <div>
      <span id="precedent"><- Précédent</span> <span id="suivant">Suivant -></span>
    </div>
  </body>
</html>

et mon fichier js:

function init()
{
alert("ca fonctionne");
var img = document.getElementById("diaporama");
var photos = ["images/1.jpg", "images/2.jpg", "images/3.jpg"];
}
window.addEventListener("load", init, false);
 
function next()
{
 
}

je pointe donc vers l"ID" diaporama et j’ai créé un tableau de trois valeur qui contient mes images, mais apres comment faire?
Si quelqu’un peut m’aider ce serait vraiment cool

2

:hello:


      <a href="#" onclick="previous()" id="precedent"><- Précédent</a> <a href="#" onclick="next()" id="suivant">Suivant -></a>
    </div>
  </body>
</html>


var photos = ["images/1.jpg", "images/2.jpg", "images/3.jpg"];
var i=0;
function next()
{
 i++;
 if (i>=3) return;
 document.getElementById("diaporama").src=photos[i];
}
function previous(){
 i--;
 if (i<=0) return;
 document.getElementById("diaporama").src=photos[i];
}

Edité le 27/09/2007 à 15:26

3

Merci mais j’ai pas lacher l’affaire et j’ai fini par trouver…

4

Ok, très bien :wink: