affichage d'image

**ric009** · 22/03/2013, 19h46

Bonsoir à tous !
Je ne connais rien du tout en javascript mais j'ai réussi à récupérer un script pour afficher une image en fonction du contenu d'un select mais le problème est que sous IE quand je n'ai rien sélectionne (quand le select n'est pas encore actif) et bien cela affiche un cadre de photo vide alors que sous chrome cela n'affiche rien...
Comment faire pour que le résultat sous chrome soit le même sur IE ?

voici mon code :

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
 
<div id="images">
<img id="image" alt="" src="" style="width:150px;" />
<script type="text/javascript">
var valueToImage = {
  voiture : "images/voiture.jpg",
  métro : "images/metro.png",
  piéton : "images/pieton.jpg"
};
 
function fonction_image(select) {
  var valeur = select.options[select.selectedIndex].value;
  if(valeur==0 || "")
  {  document.getElementById("image").src = "images/non_defini.jpg" ;}
  else
  document.getElementById("image").src = valueToImage[valeur];
 
}
</script>

Des idées ?
merci par avance !

**§Gama§** · 23/03/2013, 00h07

bonjour,
il semble que la partie de code que tu donnes n'aies pas de fonctionnement différent sous chrome ou sous IE...
ne serait-ce pas un problème de configuration?

Et peux tu mettre le code en entier,.... c'est peut-etre un problème dans le HTML, BODY,...Etc..

**ric009** · 23/03/2013, 22h22

autant pour moi même chrome donne le même résultat ... et j'ai vérifier avec un validateur W3C et mon code html est bon donc pas de problème de balise html ou body ...

comment supprimer ce cadre vide ... ?
peut être que ma condition n'est pas bonne ? ou peut être mon select ..

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
 
 
<select id="genre" class="span2" name="genre" style="width:150px" onchange="ta_fonction(this);"><option value="">--</option>
<option value="metro">metro</option>
<option value="voiture">voiture</option>
<option value="pieton">pieton</option></select><?php echo str_repeat('&nbsp;',6);?>
<select id="type" class="span2" name="type" style="width:150px"><option value="">type</option>
<option value="ligne" class="metro">ligne</option>
<option value="model" class="voiture">model</option>
<option value="marche" class="pieton">marche</option>
</select>
 
<script src="https://raw.github.com/tuupola/jquery_chained/master/jquery.chained.min.js" type="text/javascript" charset="utf-8"></script><script type="text/javascript" charset="utf-8">
          $(function(){
              $("#type").chained("#genre"); 
          });
          </script>
    <script src="//cdnjs.cloudflare.com/ajax/libs/prettify/r224/prettify.js" type="text/javascript"></script><script src="//cdnjs.cloudflare.com/ajax/libs/jquery.lazyload/1.8.4/jquery.lazyload.min.js" type="text/javascript"></script><script src="http://www.appelsiini.net/js/socialite.min.js" type="text/javascript"></script><script>
      //<![CDATA[
        $(function() {
            $(".container img").lazyload({
                //effect: "fadeIn"
            })
 
            prettyPrint();
 
        });
 
        /*
        $(window).bind("load", function() { 
            var timeout = setTimeout(function() { Socialite.load(); }, 1000);
        });
        */
 
        $(window).one("scroll resize", function() {
            Socialite.load();
        });
      //]]>
    </script>

**NoSmoking** · 24/03/2013, 11h33

Bonjour,
mets une image par défaut au chargement

à partir d'un code donné sur une autre discussion

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
<!DOCTYPE html>
<html lang="fr">
<head>
<meta charset="UTF-8">
<title>[onchange]</title>
</head>
<body>
<select id="le_select">
  <option value="http://web.developpez.com/faq/theme/images/mini_logo_faq_xhtml.gif">XHTML</option>
  <option value="http://web.developpez.com/faq/theme/images/mini_logo_faq_css.gif">CSS</option>
  <option value="http://web.developpez.com/faq/theme/images/mini_logo_faq_js.gif">Javascript</option>
</select>
<br><img id="image" src="http://javascript.developpez.com/template/images/logo.png" alt="">
<script>
var oSelect = document.getElementById('le_select');
var oImage  = document.getElementById('image');
oImage.src  = oSelect.value;
oSelect.onchange = function(){
  oImage.src = this.value;
}
</script>
</body>
</html>

**ric009** · 24/03/2013, 12h20

merci pour ton aide !

il me suffisait de mettre une image dans le src ... et voilà plus de problème !

Cordialement.

affichage d'image

JavaScript

Discussions similaires

Partager

Partager