Discussion :

[nathanh]

Bonjour à tous,
je souhaite créer un diaporama de photos en utilisant OnClick pour changer d'image en cliquant sur un bouton avec son numéro.

Ce que j'ai fait fonctionne avec IE, Chrome et Safari, mais pas avec Firefox.

Voici mon code javascript :

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
function diaporama1() {
  img.src = 'https://lh3.googleusercontent.com/-TiBJQUxy_KE/UHXzxfnwQ1I/AAAAAAAAApo/fqLy-EBvL2Y/s672/1.jpg';
}
 
function diaporama2() {
  img.src = 'https://lh3.googleusercontent.com/-nM2VmMRvN9o/UHXzxfcwTzI/AAAAAAAAApk/qv-w3hOryus/s698/10.jpg';
}
 
function diaporama3() {
  img.src = 'https://lh6.googleusercontent.com/-z8EG-qJHJK8/UHXzxbE7HYI/AAAAAAAAAps/RinMMwwm5Bw/s673/11.jpg';
}
 
function diaporama4() {
  img.src = 'https://lh5.googleusercontent.com/-EOa34QK2Yb0/UHXzyrkR53I/AAAAAAAAAp4/DKbIJIyvQYc/s675/12.jpg';
}
 
function diaporama5() {
  img.src = 'https://lh6.googleusercontent.com/-7v2me1fSyQM/UHXzzCa4eLI/AAAAAAAAAqA/GwVYa8XXcjI/s670/13.jpg';
}
 
function diaporama6() {
  img.src = 'https://lh3.googleusercontent.com/-YDxGqVKRz7Q/UHXzzB-5eAI/AAAAAAAAAqE/_QexSvtYMtw/s672/14.jpg';
}
 
function diaporama7() {
  img.src = 'https://lh5.googleusercontent.com/-hdnLu3NuYzw/UHXzzskJB3I/AAAAAAAAAqM/1yCMQaDE1sc/s674/15.jpg';
}
 
function diaporama8() {
  img.src = 'https://lh4.googleusercontent.com/-LZGWAY8VqkM/UHXz0II2V7I/AAAAAAAAAqY/Si0ZIdU6MOc/s670/16.jpg';
}
 
function diaporama9() {
  img.src = 'https://lh5.googleusercontent.com/-XOenYPpESQg/UHXz0bnmxoI/AAAAAAAAAqU/ZU8Mw0f5_Z4/s670/17.jpg';
}
 
function diaporama10() {
  img.src = 'https://lh6.googleusercontent.com/-xfqrCUBVuz4/UHXz0t3egBI/AAAAAAAAAqk/PPbQtut2p-U/s671/2.jpg';
}
 
function diaporama11() {
  img.src = 'https://lh5.googleusercontent.com/-MciDyL2o-m8/UHXz1XuWntI/AAAAAAAAAqw/EMterkisG0Y/s700/3.jpg';
}
 
function diaporama12() {
  img.src = 'https://lh4.googleusercontent.com/-K5Aqw6lQ9C4/UHXz119X_-I/AAAAAAAAAq4/Ql5wCcEb4aY/s686/4.jpg';
}
 
function diaporama13() {
  img.src = 'https://lh4.googleusercontent.com/-Z212LcjjrLY/UHXz2FqqqwI/AAAAAAAAAq8/0LDOXWDNuWQ/s696/5.jpg';
}
 
 
function diaporama14() {
  img.src = 'https://lh4.googleusercontent.com/-UeboXPNSvAE/UHXz2t4Ug9I/AAAAAAAAArE/1sY2Va1XCEM/s670/6.jpg';
}
 
 
function diaporama15() {
  img.src = 'https://lh3.googleusercontent.com/-kooqm0Hyecc/UHXz3VikbWI/AAAAAAAAArY/a5whD1BeKd4/s670/7.jpg';
}
 
 
function diaporama16() {
  img.src = 'https://lh4.googleusercontent.com/-QyLfOcncl_Q/UHXz3kNMkjI/AAAAAAAAArQ/ocGqPJsG9_U/s695/8.jpg';
}
 
 
function diaporama17() {
  img.src = 'https://lh4.googleusercontent.com/-pme1tlyOMG4/UHXz32134cI/AAAAAAAAArc/yEyDVgIqdXQ/s678/9.jpg';
}

Et mon code html avec les images et les boutons en dessous :

Code html :

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
<p>
<img name="img" src="https://lh3.googleusercontent.com/-TiBJQUxy_KE/UHXzxfnwQ1I/AAAAAAAAApo/fqLy-EBvL2Y/s672/1.jpg""><br>
<input type="button" value="1" OnClick="diaporama1()" />
<input type="button" value="2" OnClick="diaporama2()" />
<input type="button" value="3" OnClick="diaporama3()" />
<input type="button" value="4" OnClick="diaporama4()" />
<input type="button" value="5" OnClick="diaporama5()" />
<input type="button" value="6" OnClick="diaporama6()" />
<input type="button" value="7" OnClick="diaporama7()" />
<input type="button" value="8" OnClick="diaporama8()" />
<input type="button" value="9" OnClick="diaporama9()" />
<input type="button" value="10" OnClick="diaporama10()" />
<input type="button" value="11" OnClick="diaporama11()" />
<input type="button" value="12" OnClick="diaporama12()" />
<input type="button" value="13" OnClick="diaporama13()" />
<input type="button" value="14" OnClick="diaporama14()" />
<input type="button" value="15" OnClick="diaporama15()" />
<input type="button" value="16" OnClick="diaporama16()" />
<input type="button" value="17" OnClick="diaporama17()" />
</p>

J'ai cherché à trouver la solution dans de précédents posts sur ce probleme avec OnClick et Firefox, mais je n'ai pas trouvé de solution, ou alors n'ai aps su les adapter à mon code qui est un peu différent que ce que j'ai trouvé sur Internet.

Merci d'avance pour votre aide, si vous avez des conseils au niveau du code en lui-même (pas forcément OnClick), n'hésitez pas, j'ai l'impression que je n'ai pas choisi la solution de diaporama la moins chargée

[Bovino]

Ca n'a rien à voir avec onclick mais plus avec ta façon de coder...

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

img.src = '...';

Ici, img ne correspond à rien et JavaScript essaye de trouver une propriété d'un objet nommé img.
Par chance (pour toi, pas pour la rigueur informatique...) certains navigateurs parviennent à comprendre que tu recherches la balise <img /> ayant le nom img (choix assez maladroit), mais tous ne le font pas, dont Firefox.

Au passage, tu devrais aussi essayer de comprendre à quoi peuvent bien servir les paramètres que l'on peut passer à une fonction...

[andry.aime]

Bonjour,

Pourquoi ne pas utiliser une seule fonction en passant l'url en paramètre?

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

document.images["img"].src = "https://lh3.googleusercontent.com/-TiBJQUxy_KE/UHXzxfnwQ1I/AAAAAAAAApo/fqLy-EBvL2Y/s672/1.jpg";

A+.

[SpaceFrog]

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
function diaporama(nrimg) {
  img.src = 'https://lh3.googleusercontent.com/-TiBJQUxy_KE/UHXzxfnwQ1I/AAAAAAAAApo/fqLy-EBvL2Y/s672/'+nrimg+'.jpg';
}

[nathanh]

Merci beaucoup en effet en modifiant le code selon vos indications ça fonctionne parfaitement. Je me doute que ce n'est pas un super problème mais je ne trouvais pas merci beaucoup de m'avoir aidé.

Merci à ce forum également et à ceux qui s'en occupent!