Sujet Précédent Sujet Suivant

Legende photo

Fermé
ramer - 4 janv. 2014 à 18:28
mpmp93 Messages postés 6652 Date d'inscription mercredi 13 avril 2011 Statut Membre Dernière intervention 28 septembre 2015 - 14 janv. 2014 à 10:12
Bonjour,

Voici mon code html et mon probleme est : la legende de l'image ne s'affiche pas, pourquoi ?

<script LANGUAGE="JavaScript">
var photo=new Array()

var texte=new Array()

var num=0

var txt=0

photo[0]="veilles_forges_13/0.jpg"

texte[0]="Léa"

photo[1]="veilles_forges_13/1.jpg"

texte[1]="Légende 2"

photo[2]="veilles_forges_13/2.jpg"

texte[2]="Légende 3"

window.onload=new Function("legende.value=texte[txt]")

numero=num+1

total=photo.length

window.status='Diaporama photo '+numero+' sur '+total

function backward(){

if (num>0){

num--

image.src=photo[num];

txt--

legende.value=texte[txt];

numero=num+1

window.status='Diaporama photo '+numero+' sur '+total

}

}

function forward(){

if (num<photo.length-1){

num++

image.src=photo[num]

txt++

legende.value=texte[txt];

numero=num+1

window.status='Diaporama photo '+numero+' sur '+total

}

}

</script>

<tr>
<td align="center" width="100%" colspan="4"><p align="center"><fontcolor="#008000" face="Arial"><big><big><strong>Veilles Forges 2013</strong></big></big></font></p>
<p align="center"><img NAME="image" src="veilles_forges_13/0.jpg" WIDTH="100%" HEIGHT="100%"> <br>
</td>
</tr>
<center><input TYPE="text" NAME="legende"style="width: 240px; background-color: white; text-align: center; vertical-align: middle; font-family: Times New Roman; font-size: 10pt"size="30"></center>
<center>
<table>
<tfoot>
<tr>
<td class="sansbordure"><input TYPE="button" VALUE="<< Photo précédente" ONCLICK="backward()" NAME="B1"></td>
<td class="sansbordure"><input TYPE="button"VALUE="Photo suivante >>" ONCLICK="forward()" NAME="B2"></td>
</tr>
<tr>
<td class="sansbordure"><input TYPE="button" VALUE="[ Début <<"ONCLICK="num=1;txt=1;backward();return false" NAME="B3"></td>
<td class="sansbordure"><input TYPE="button" VALUE=" >> Fin ] "ONCLICK="num=total;txt=total;backward();return false" NAME="B4"></td>
</tr>
</tfoot>
</table>
</center>

Merci
A voir également:

2 réponses

Réponse 1 / 2
Utilisateur anonyme
4 janv. 2014 à 18:39
salut, ta variable legende ne corresponds à rien. Je vois un input name legende, je pense que tu voulais faire un getElementsByName et que tu as oublié.
1
Utilisateur anonyme
4 janv. 2014 à 19:09
ton script tu dois aussi le mettre en fin de page juste avant la balise fermante </body>
0
ramer
4 janv. 2014 à 20:35
Merci, j'ai essayé de mettre le script avant la borne </body> mais ca ne marche tjs pas et je ne sais pas ce que c'est qu'un getElementsByName. moi je veux juste qu'en dessous de chaque photo ca affiche le titre de la photo.
0
mpmp93 Messages postés 6652 Date d'inscription mercredi 13 avril 2011 Statut Membre Dernière intervention 28 septembre 2015 1 339
14 janv. 2014 à 10:12
Bonjour,

Vous dites: "moi je veux juste qu'en dessous de chaque photo ca affiche le titre de la photo."

En HTML5, avec FIGURE et FIGCAPTION, ya la solution:
https://html5.immo-scope.com/article/html5_debuter_elementFigure

Exemple: 
<figure>
   <img src="imageExemple.jpg"/>
   <figcaption>l'apéro</figcaption>
</figure>




A+
0
Réponse 2 / 2
Utilisateur anonyme
Modifié par lobotoFix le 4/01/2014 à 20:47
salut
dans onload tu enleve ton parametre

tu laisse tout en bas le code et tu rajoute : cela au début de ton script, première ligne


var legende = document.getElementsByName("legende")[0];


puis tu met dans ton input value="Léa"


ce qui te fera 

<body>
  <table>
   <tr>
    <td align="center" width="100%" colspan="4">
    <p align="center">
     <fontcolor="#008000" face="Arial">
      <big><big><strong>Veilles Forges 2013</strong></big></big></font>
    </p>
    <p align="center"><img NAME="image" src="img.jpg" WIDTH="100%" HEIGHT="100%">
     <br>
    </td>
   </tr>
   <center>
    <input TYPE="text" NAME="legende" style="width: 240px; background-color: white; text-align: center; vertical-align: middle; font-family: Times New Roman; font-size: 10pt"size="30" value="Léa">
   </center>
   <center>
    <table>
     <tfoot>
      <tr>
       <td class="sansbordure">
       <input TYPE="button" VALUE="<< Photo précédente" ONCLICK="backward()" NAME="B1">
       </td>
       <td class="sansbordure">
       <input TYPE="button"VALUE="Photo suivante >>" ONCLICK="forward()" NAME="B2">
       </td>
      </tr>
      <tr>
       <td class="sansbordure">
       <input TYPE="button" VALUE="[ Début <<"ONCLICK="num=1;txt=1;backward();return false" NAME="B3">
       </td>
       <td class="sansbordure">
       <input TYPE="button" VALUE=" >> Fin ] "ONCLICK="num=total;txt=total;backward();return false" NAME="B4">
       </td>
      </tr>
     </tfoot>
    </table>
   </center>

  </table>
  <script LANGUAGE="JavaScript">
   var photo = new Array();
   var legende = document.getElementsByName("legende")[0];
   var texte = new Array();

   var num = 0;

   var txt = 0;

   photo[0] = "veilles_forges_13/0.jpg";

   texte[0] = "Léa";

   photo[1] = "veilles_forges_13/1.jpg";

   texte[1] = "Légende 2";

   photo[2] = "veilles_forges_13/2.jpg";

   texte[2] = "Légende 3";

   window.onload = new Function();

   numero = num + 1;

   total = photo.length;

   window.status = 'Diaporama photo ' + numero + ' sur ' + total;

   function backward() {

    if (num > 0) {

     num--;

     image.src = photo[num];

     txt--;

     legende.value = texte[txt];

     numero = num + 1;

     window.status = 'Diaporama photo ' + numero + ' sur ' + total;

    }

   }

   function forward() {

    if (num < photo.length - 1) {

     num++;

     image.src = photo[num];

     txt++;

     legende.value = texte[txt];

     numero = num + 1;

     window.status = 'Diaporama photo ' + numero + ' sur ' + total;

    }

   }

  </script>
 </body>

(¯'·.¸¸.·'¯'·.¸¸.-> <-.¸¸.·'¯'·.¸¸.·'¯)
0
Utilisateur anonyme
4 janv. 2014 à 20:49
j'ai rajouté des point virgule je préfere
0

Discussions similaires

Pix
Anyssa -
vibe -

4 réponses
logiciel de déshabillage de photo
badboy35 -
PyNux --replace Alambik.JP -

3 réponses