Images en fonction de choix dans liste déroulantes

**FCL31** · 02/03/2010, 12h16

Salut a tous

Je sais pas si je poste au bon endroit et si se n'est le cas je m'en excuse d'avance

Je suis pas très fort en HTML (je suis même pas certains que se soit en HTML qui me faille le faire)

Voici mon problème :

Sur mon site, j'ai une image (d'une voiture)
et j'ai plusieurs listes déroulante qui vont définir des options sur la voiture (ex : type de toit; type de jante,...)

Le truc c'est que je voudrais que l'image change en fonction des options choisies

Mais j'ai aucune idée de comment faire et c'est pourquoi je vous demandes beaucoup d'aide SVP

PS : Si sa peu aider, j'ai déjà un exemple de liste déroulante:

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
96
97
98
99
100
101
102
103
104
105
106
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
  <meta content="text/html; charset=ISO-8859-1"
 http-equiv="content-type">
  <title>GLX</title>
</head>
<body>
<br>
<select class="" style="width: 400px;"
 name="MANUFACTURERS" id="MANUFACTURERS" size="1"
 onchange="onChangeSelectManuf(this);">
<option value=""> ------- Choisissez une marque ------- </option>
<option id="MAN_303" value="303">ABARTH</option>
<option id="MAN_12" value="12">ALFA ROMEO</option>
<option id="MAN_272" value="272">ALPINA</option>
<option id="MAN_271" value="271">ALPINE</option>
<option id="MAN_277" value="277">ARO</option>
<option id="MAN_278" value="278">ASIA</option>
<option id="MAN_273" value="273">ASTON MARTIN</option>
<option id="MAN_21" value="21">AUDI</option>
<option id="MAN_260" value="260">AUSTIN</option>
<option id="MAN_23" value="23">AUTOBIANCHI</option>
<option id="MAN_25" value="25">BEDFORD</option>
<option id="MAN_280" value="280">BENTLEY</option>
<option id="MAN_33" value="33">BMW</option>
<option id="MAN_283" value="283">BUICK</option>
<option id="MAN_257" value="257">CADILLAC</option>
<option id="MAN_284" value="284">CATERHAM</option>
<option id="MAN_46" value="46">CHEVROLET</option>
<option id="MAN_47" value="47">CHRYSLER</option>
<option id="MAN_49" value="49">CITRO&Euml;N</option>
<option id="MAN_54" value="54">DACIA</option>
<option id="MAN_55" value="55">DAEWOO</option>
<option id="MAN_56" value="56">DAF</option>
<option id="MAN_57" value="57">DAIHATSU</option>
<option id="MAN_261" value="261">DAIMLER</option>
<option id="MAN_256" value="256">DODGE</option>
<option id="MAN_286" value="286">F.S.O. / POLSKI</option>
<option id="MAN_264" value="264">FERRARI</option>
<option id="MAN_76" value="76">FIAT</option>
<option id="MAN_77" value="77">FORD</option>
<option id="MAN_269" value="269">FORD USA</option>
<option id="MAN_92" value="92">G.M.E.</option>
<option id="MAN_84" value="84">GALLOPER</option>
<option id="MAN_98" value="98">HONDA</option>
<option id="MAN_100" value="100">HYUNDAI</option>
<option id="MAN_302" value="302">INFINITI</option>
<option id="MAN_103" value="103">INNOCENTI</option>
<option id="MAN_105" value="105">ISUZU</option>
<option id="MAN_108" value="108">JAGUAR</option>
<option id="MAN_109" value="109">JEEP</option>
<option id="MAN_114" value="114">KIA</option>
<option id="MAN_119" value="119">LADA</option>
<option id="MAN_265" value="265">LAMBORGHINI</option>
<option id="MAN_120" value="120">LANCIA</option>
<option id="MAN_121" value="121">LAND ROVER</option>
<option id="MAN_123" value="123">LDV</option>
<option id="MAN_124" value="124">LEXUS</option>
<option id="MAN_125" value="125">LEYLAND</option>
<option id="MAN_274" value="274">LIGIER</option>
<option id="MAN_270" value="270">LOTUS</option>
<option id="MAN_288" value="288">MAHINDRA</option>
<option id="MAN_136" value="136">MARUTI</option>
<option id="MAN_267" value="267">MASERATI</option>
<option id="MAN_255" value="255">MAYBACH</option>
<option id="MAN_137" value="137">MAZDA</option>
<option id="MAN_140" value="140">MERCEDES-BENZ</option>
<option id="MAN_259" value="259">MG</option>
<option id="MAN_141" value="141">MINI</option>
<option id="MAN_142" value="142">MITSUBISHI</option>
<option id="MAN_289" value="289">MORGAN</option>
<option id="MAN_262" value="262">MORRIS</option>
<option id="MAN_158" value="158">NISSAN</option>
<option id="MAN_163" value="163">OPEL</option>
<option id="MAN_168" value="168">PEUGEOT</option>
<option id="MAN_292" value="292">PIAGGIO</option>
<option id="MAN_268" value="268">PONTIAC</option>
<option id="MAN_170" value="170">PORSCHE</option>
<option id="MAN_172" value="172">PROTON</option>
<option id="MAN_293" value="293">RELIANT</option>
<option id="MAN_178" value="178">RENAULT</option>
<option id="MAN_266" value="266">ROLLS-ROYCE</option>
<option id="MAN_179" value="179">ROVER</option>
<option id="MAN_181" value="181">SAAB</option>
<option id="MAN_187" value="187">SANTANA</option>
<option id="MAN_192" value="192">SEAT</option>
<option id="MAN_200" value="200">SKODA</option>
<option id="MAN_138" value="138">SMART</option>
<option id="MAN_204" value="204">SSANGYONG</option>
<option id="MAN_206" value="206">SUBARU</option>
<option id="MAN_208" value="208">SUZUKI</option>
<option id="MAN_210" value="210">TALBOT</option>
<option id="MAN_294" value="294">TATA</option>
<option id="MAN_220" value="220">TOYOTA</option>
<option id="MAN_263" value="263">TRIUMPH</option>
<option id="MAN_297" value="297">TVR</option>
<option id="MAN_226" value="226">VAUXHALL</option>
<option id="MAN_230" value="230">VOLKSWAGEN</option>
<option id="MAN_231" value="231">VOLVO</option>
<option id="MAN_299" value="299">WARTBURG</option>
<option id="MAN_300" value="300">YUGO/ZASTAVA</option>
<option id="MAN_301" value="301">ZAZ TAVRIA</option>
</select>
</body>
</html>

**Epica84** · 02/03/2010, 13h29

Salut,

Je te conseillerai de faire du JavaScript cela me semble le langage le plus pertinent pour ton problème .

Cordialement

**Erwan31** · 02/03/2010, 16h08

Au passage ce doctype : <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> fait basculer les navigateurs graphiques en mode Quirks (à éviter). Faire une recherche pour les détails.

Images en fonction de choix dans liste déroulantes

JavaScript

Discussions similaires

Partager

Partager