Select image en javascript

**daly1589** · 07/03/2014, 17h13

Bonjour tout le monde,

Je suis débutante en javascript ...je voudrais réaliser un select qui affiche des image comme dans ce tuto

http://www.flowsim.se/picts/iljjava/eiljsele.html

Le problème c'est qu'en suivant ce qu ils recommandent rien ne s'affiche...je remplace le mot iljblid par une photo, exemple : http://upload.wikimedia.org/wikipedi...Stonehenge.jpg j'enleve le JPG...pour le mettre après comme il demande mais rien n'y fait !!!!

**NoSmoking** · 08/03/2014, 15h57

Bonjour et bienvenue sur DVP.
La meilleur des choses que tu puisses faire c'est de nous mettre le code que tu as réalisé/modifié.

**daly1589** · 10/03/2014, 14h04

voici mon code:

Code html :

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

1
2
3
4
5
6
 <select id="changeImage">
  <option value="0">image 0</option>
  <option value="1">image 1</option>
  <option value="2">image 2</option>
</select>
<img id="image" src='//C:Users/FRAME/Desktop/pic/1.jpg'>

Code :

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

1
2
3
4
5
6
7
8
9
var imagesArray = [
  "//C:Users/FRAME/Desktop/pic/1.jpg"
   "//C:Users/FRAME/Desktop/pic/2.jpg"
  "//C:Users/FRAME/Desktop/pic/2.jpg" 
];
 
$('#changeImage').change(function(){
  $('#image')[0].src = imagesArray[this.value];
})

Mes photos ne s'affichent pas!
j'ai essaye ca aussi! qui marche sur le simulateur w3schools mais pas mes navigateur...

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
21
22
23
24
25
26
<!doctype html>
 
<html lang="fr">
  <head>
 
    <script src="http://code.jquery.com/jquery-1.10.2.min.js"></script>
  <meta charset="utf-8">
  <title>JS Bin</title>
</head>
<body>
 
  <select id="changeImage">
    <option>cf5</option>
    <option>f1f</option>
    <option>444</option>
  </select>
  <img id="image" src='//placehold.it/50x50/cf5'>
 
	<script type="text/javascript">
        $('#changeImage').change(function(){
  $('#image')[0].src = "//placehold.it/50x50/"+this.value;
});
    </script>
 
  </body>
</html>

**blinkman04** · 13/03/2014, 12h58

Petite question bête, quand tu inspecte t'a page à l'aide de ton navigateur. Pas d'erreur comme quoi les chemins de tes images sont incorrecte ? Première chose à vérifier pour moi ^^

**SpaceFrog** · 13/03/2014, 15h08

un src d'image ne connait pas le type de path que tu essayes de lui fournir ...

regarde du coté du protocole file://

**NoSmoking** · 13/03/2014, 19h10

Si on reprend ton SELECT

Code html :

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

1
2
3
4
5
<select id="changeImage">
    <option>cf5</option>
    <option>f1f</option>
    <option>444</option>
</select>

on s’aperçoit que tes OPTIONs n'ont pas de value, donc comment veux tu récupérer la value du SELECT, même si dans l'absolue jQuery te sauve si tu utilises $(this).val().

Tu devrais réorganiser tes répertoires afin de ne pas avoir des paths contenant des //C:Users/FRAME par exemple.

Select image en javascript

jQuery

Vue hybride

Discussions similaires

Partager

Partager