[HTML][JS] Changement d'image dans un <select>

Marsh Posté le 22-03-2008 à 13:32:53

Salut à tous. Voilà j'ai une requête un peu spéciale à vous demander.
J'aimerais créer un petit menu <select> dans lequel il y aurais deux options possibles : Clair et Noir.
Je voudrais ensuite que chaque fois qu'une des deux options est sélectionnée (en utilisant onChange), Selon le choix ca affiche une image différente dans ce lien :

Code :

<a href="ImgGrdFormatClair.html"><img src="ImgClair.jpg" style="float:left;margin-right:8px;border:0;" alt=""></a>

(oui de base l'image claire est affichée)

Donc je voudrais que le petit menu <select> modifie l'image "ImgClair.jpg" en "ImgNoir.jpg" quand je choisis l'option Noir et inversement quand je choisis l'option Clair.
Pour info je ne sais pas comment créer un objet image, et je pense que c'est pour cela aussi que je n'arrive pas à permettre à la fonction <seclect> de modifier les images, car elles n'ont pas de nom de script qui peuvent être appelés.
Merci pour toutes les aides que vous pourriez m'apporter.
Je vous rajoute mon code pour le <select> si ca peut vous être utile, j'aimerais autant qu'il ne soit pas modifié, sauf peut être les options values, ce qui me semble obligatoire.

Code :

<select id="11-005-1" name="ADDITIONALINFO"><option value="Clair^0">Clair<option
value="Noir^1">Noir</select>

Merci à tous.

Reply

Marsh Posté le 22-03-2008 à 13:32:53

Reply

Marsh Posté le 23-03-2008 à 03:13:07

Up !

Reply

Marsh Posté le 23-03-2008 à 10:06:41

En gros :

Code :

<a href="ImgGrdFormatClair.html"><img id="monimage" src="ImgClair.jpg" style="float:left;margin-right:8px;border:0;" alt=""></a>

Code :

<script type="text/javascript">
function majImage() {
if(document.getElementById('selecteur').value == 'Clair^0')
document.getElementById('monimage').src = 'imageClaire.jpg';
else if(document.getElementById('selecteur').value = 'Sombre^1')
document.getElementById('monimage').src = 'imageSombre.jpg';
}</script>
<select name="ADDITIONALINFO" id="selecteur" onclange="majImage();"><option value="Clair^0">Clair<option value="Noir^1">Noir</select>

c'est incomplet, en l'état ça ne doit même pas marcher...

Remarque : le premier caractère de la valeur de l'attribut id ne doit pas être un nombre, attention.

---------------
Martin

Reply

Marsh Posté le 23-03-2008 à 15:20:29

En fait le code que je vous ais donner a été créer automatiquement par un programme de création de site web. Je m'y connais vraiment pas beaucoup en HTML, mais je comprend a peut près, étudiant en parallèle le C#, je me repère plutôt bien.
Je vais tester ton code Martius et je vais tenter de le remanier dans ma page toute crée avec le peu de connaissance que j'ai, et je te donne des nouvelles.

Reply

Marsh Posté le 23-03-2008 à 16:47:43

y'a quelques petites fautes (onclange et le 1er src="ImgClair.jpg) sinon ça marche :jap:

Reply

Marsh Posté le 24-03-2008 à 14:33:36

Ca marche nickel, merci beaucoup Martius, désolé pour les familiarités mais je t'aime

Reply

[HTML][JS] Changement d'image dans un <select>

Sujets relatifs:

Leave a Replay