[javascript] changer une image sur onclick

Résolu
Bonjour,

j'essaye de mettre en place un diaporama mais je n'arrive pas a le faire fonctionner
si vous trouver ce qui ne marche pas, je serai heureux que vous me veniez en aide
Merci beaucoup

LE HTML
<html>
<head>
<title>Auto école Nouvel Age : </title>

<!-- Feuille de style -->
<link rel="stylesheet" type="text/css" href="menuderoul.css">
<!------------------------>

<!-- Bibliothèque javascript -->
<script type="text/javascript" src="javascript/menuderoul.js"></script>
<script type="text/javascript" src="javascript/diaporama.js"></script>
<!----------------------------------->
</head>

<body>

<table align="center" class="tablecenter"><tr><td width="800px" colspan=2>

<img src="image/logo.gif">
<!--tabelau du menu ----------------------------------------------------------------------------------------------->
<?php include("menu.html"); ?>
<!----------------------------------------------------------------------------------------------------->
</td></tr>
<tr><td width="175px"></td><td>

<!-- corps de la page ----------------------------------------------------------------------------------------------->
<div class="corps" align="center">
EDDY... ...SERRE A DROITE
<br><br>

<div align="center">
<input type="button" name="Précédente" value="Précédente" onclick="precedente();">

<input type="button" name="suivante" value="Suivante" onclick="suivante();">

<input type="button" name="Diaporama" value="Diaporama" onclick="auto();">
</div>
<br>
<div align="center"><img src="image/pourrire/0.jpg" id="image" width="640" height="480"></div>

</div>
<!----------------------------------------------------------------------------------------------------->

</td></tr>
<tr><td height="400px" colspan=2></td></tr></table>
</body>

</html>

ET LE JAVASCRIPT

<script>
var Dossier = "image/pourrire/";
var Numero = 0;
var Nom = new Array;
Nom[0] = "0.jpg";
Nom[1] = "1.jpg";

function suivante()
{
Numero += 1;
if (Numero == NomImage.length + 1)
{
Numero = 1;
}
document.image.src=Dossier+Nom[Numero];
}

</script>
Configuration: Windows XP
Firefox 2.0.0.12

8 réponses

  1. Et pour info, tout le monde s'en fout vu la date mais
    document.getElementById("image").src = Dossier+Nom[Numero];

    fonctionne très bien !!
    Suffit juste de ne pas mettre de majuscule à GetElementById.

    @+
    1. non moi ca m'interesse :)
    2. hihi ! 2012 !!
    3. moi aussi ca m'a intéressé
    4. Vraiment bien!! Merci :)
  2. Contributeur
    ca ca marche

    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
    <title>Untitled Document</title>
    <script language="JavaScript">

    var dossier="image/pourrire/";
    var numero = 1;
    function objet() {
    this.length = objet.arguments.length
    for (var i = 0; i < this.length; i++) this[i+1] = objet.arguments[i]
    }
    var nom = new objet ("0.jpg", "1.jpg");

    function suivante() {
    numero += 1;
    if (numero == nom.length + 1) numero = 1;
    document.image.src = dossier+nom[numero];
    }
    </script>
    </head>
    <body>

    <table align="center" class="tablecenter"><tr><td width="800px" colspan=2>

    <img src="image/logo.gif">
    <!--tabelau du menu ------------------------------------------------------------------------------------------ ----->
    <?php include("menu.html"); ?>
    <!------------------------------------------------------------------------------------ ----------------->
    </td></tr>
    <tr><td width="175px"></td><td>

    <!-- corps de la page ------------------------------------------------------------------------------------------ ----->
    <div class="corps" align="center">
    EDDY... ...SERRE A DROITE
    <br><br>

    <div align="center">
    <input type="button" name="Précédente" value="Précédente" onclick="precedente();">

    <input type="button" name="suivante" value="Suivante" onclick="suivante();">

    <input type="button" name="Diaporama" value="Diaporama" onclick="auto();">
    </div>
    <br>
    <div align="center"><img src="0.jpg" id="image" width="640" height="480"></div>

    </div>
    <!----------------------------------------------------------------------------------- ------------------>

    </td></tr>
    <tr><td height="400px" colspan=2></td></tr></table>
    </body>

    </html>
    1. j'ai fait çà

      function suivante()
      {
      Numero += 1;
      document.GetElementById("image").src = Dossier + Nom[Numero];
      }

      je l'avait déjà essayer mais ça ne marche pas

      je commence a devenir fou...

      merci quand même de ton aide
      1. Salut

        j'ai oublier de changer le nom mais pour l'instant c'est pas censé rentrer dans le if,
        changer la premiere image ne marche pas

        function suivante()
        {
        Numero += 1;
        document.image.src=Dossier+Nom[Numero];
        }

        Merci quand meme, à l'aide...
        1. MERCI FRANCISBRICO
          TU ES MON DIEU lol
          tu me sors pas mal de la m....
          merci a toi aussi christounet
          1. Bonjour

            Tu définis une variable Nom[0] et Nom[1] mais tu testes la variable NomImage.length ?

            A plus
            1. Bonjour,

              Tu dois utiliser GetElementById

              document.GetElementById("image").src = Dossier+Nom[Numero]


              A plus
              1. il faut ajouter l'extension !!
                document.GetElementById("image").src = Dossier+Nom[Numero].'extension'