Bonjour,
J'ai réalisé (en m'inspirant sur internet) un outils permettant de faire défiler des images auxquelles sont associées:
- des commentaires en bas de l'image
- et un curseurs (image pointblanc.png quand l'image n'est pas sélectionnée et pointrose.png quand l'image est sélectionnée)
En HTML (voir fichier joint Ecranhtml.png) le code fonctionne mais en PHP pointblanc.png et pointrose.png n'apparaissent pas (voir fichier joint Ecranphp.png).
Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95 <!DOCTYPE html> <html> <head> <script type="text/javascript"> var num=1; // numéro du fichier courant var min=1; // nombre minimum de fichiers var max=5; // nombre maximum de fichiers var extension = '.png'; var legend1="Commentaire1"; var legend2="Commentaire2"; var legend3="Commentaire3"; var legend4="Commentaire4"; var legend5="Commentaire5"; /* fonction qui permet d'afficher les images */ function Affich() { var file; // on ajoute des '0' afin de créer le nom du fichier if(num<10) file = '00'+num+extension; if(num<100 && num>=10) file = '0'+num+extension; if(num==1) legende=legend1; if(num==2) legende=legend2; if(num==3) legende=legend3; if(num==4) legende=legend4; if(num==5) legende=legend5; if(num==1) {document.getElementById('case1').innerHTML="<img src=pointrose.png/></a>"} else {document.getElementById('case1').innerHTML="<img src=pointblanc.png/></a>"}; if(num==2) {document.getElementById('case2').innerHTML="<img src=pointrose.png/></a>"} else {document.getElementById('case2').innerHTML="<img src=pointblanc.png/></a>"}; if(num==3) {document.getElementById('case3').innerHTML="<img src=pointrose.png/></a>"} else {document.getElementById('case3').innerHTML="<img src=pointblanc.png/></a>"}; if(num==4) {document.getElementById('case4').innerHTML="<img src=pointrose.png/></a>"} else {document.getElementById('case4').innerHTML="<img src=pointblanc.png/></a>"}; if(num==5) {document.getElementById('case5').innerHTML="<img src=pointrose.png/></a>"} else {document.getElementById('case5').innerHTML="<img src=pointblanc.png/></a>"}; // on affiche l'image correspondante document.getElementById('image_nouveaute').innerHTML="<a href='3Gravures.html' target='_self'><img src="+file+" title="+legende+" alt="+legende+" /></a>"; document.getElementById('image_legende').innerHTML="<h5>"+legende+"</h5>"; } /* fonction qui permet de revenir à l'image précédente */ function Prev() { // si num>min car il ne faudrait pas descendre en dessous if(num>min) { num--; // on décrémente num Affich(); // et on fait appel à la fonction Affich() } } /* fonction qui permet d'aller à l'image suivante */ function Next() { // si num<min car il ne faudrait pas allerr au dessus if(num<max) { num++; // on décrémente num Affich(); // et on fait appel à la fonction Affich() } } </script> </head> <body onload="Affich()"> <table style="width:250px;"> <tr style="width:250px"> <td><a href="#" title="Précédant" onclick="Prev()"><img src="flechegauche.png" alt="Précédent" title="Précédent"/></a></td> <td colspan="5" id="image_nouveaute" style="width:190px;" align="center"></td> <td><a href="#" title="Suivant" onclick="Next()"><img src="flechedroite.png" alt="Suivant" title="Suivant"/></td> </tr> <tr style="width:250px"> <td></td> <td id="case1" align="center"></td> <td id="case2" align="center"></td> <td id="case3" align="center"></td> <td id="case4" align="center"></td> <td id="case5" align="center"></td> <td></td> </tr> <tr style="width:250px"> <td colspan="7" id="image_legende"></td> </tr> </table> </body> </html>
J'ai beau relire le code je ne trouve pas l'erreur...
Pouvez vous m'aider?
Cordialement
Partager