Salut à tous,

j'ai un petit problème. Actuellement lorsque je clic sur un des drapeaux afin de pouvoir modifier la langue, seul le texte placé sous les 2 drapeaux changent.

Je voulais savoir s'il est possible de faire en sorte que lorsque je clic sur l'un de ces 2 drapeaux, que les petites images soient respectivement changé par les images:

- http://data.imagup.com/4/1112527798.jpg) pour la 1ere image
- http://data.imagup.com/4/1112527798.jpg) pour la 2eme image

En gros, je voudrais que le contenu des images 1 et 2 (rose et vert) puisse se modifier automatiquement selon le choix de la langue choisi.

Merci d'avance pour vos réponse.

<title>Document sans nom</title>
<style type="text/css">
#A {
	width: 780px;
	margin-right: auto;
	margin-left: auto;
	line-height: 13px;
}
#B {
	text-align: center;
	width: 780px;
	font-family: "Lucida Grande";
	line-height: 16px;
}
#C {
	width: 780px;
	text-align: center;
}
#D {
	height: 400px;
	width: 700px;
	float: left;
	background-image: url(http://free0.hiboox.com/images/0711/bef02789dcb571c3631761858327c606.jpg);
}
#E {
	float: left;
	width: 80px;
	text-align: right;
}
#F {
	float: left;
	width: 80px;
	text-align: right;
}
#G {
	float: left;
	width: 80px;
	text-align: right;
}
#E1 img {
	cursor:pointer;
}
</style>
<script language="javascript">
function remplace(image) {
document.getElementById("D").innerHTML="<img src='"+image+"'>";
}
</script>
<script language="javascript">  
function affiche_text(id) {   
 
    if (id == "A"){  
        var text1 = "F";  
     }  
 
    else{  
        var text1 = "D";  
    }  
    document.getElementById("C").innerHTML = text1;
	}  
</script>
<script type="text/javascript">
function Change_image(img,new_img) {
img.src = new_img;
}
</script>	
</head>

<body>
<div id="A">
  <div id="B">
  <img src="http://free0.hiboox.com/images/0711/e8debc11d15a35594f299fae2c5b01cc.jpg" onclick="affiche_text('A');" width="41" height="12" />&nbsp;&nbsp;
  <img src="http://free0.hiboox.com/images/0711/e8debc11d15a35594f299fae2c5b01cc.jpg" onclick="affiche_text('');" width="42" height="12" /></div>
  <div id="C">F</div>
  <div id="D"></div>
  <div id="E"><img
src="http://free0.hiboox.com/images/0711/bef02789dcb571c3631761858327c606.jpg"
onclick="Change_image(this,'http://free0.hiboox.com/images/0711/e8debc11d15a35594f299fae2c5b01cc.jpg');"
height="40" width="70"><br>
<br></div>
<div id="F">
<img src="http://free0.hiboox.com/images/0711/bef02789dcb571c3631761858327c606.jpg"
onclick="Change_image(this,'http://free0.hiboox.com/images/0711/e8debc11d15a35594f299fae2c5b01cc.jpg');"
height="40" width="70"><br>
<br></div>
</div>
</body>

Modifié par qwertz1 (17 Feb 2011 - 10:41)
Bonjour, 2 choses:
1- ton titre de message n'est pas assez explicite. En général, tous le monde vient sur le forum pour obtenir de l'aide.
2- les liens pour tes images semblent erronés.

Pour obtenir de l'aide, il faut être le plus clair possible.
Ok, j'ai apporté quelques modifications au code mais ça ne fonction toujours pas.

<title>Document sans nom</title>
<style type="text/css">
#A {
	width: 780px;
	margin-right: auto;
	margin-left: auto;
	line-height: 13px;
}
#B {
	text-align: center;
	width: 780px;
	font-family: "Lucida Grande";
	line-height: 16px;
}
#C {
	width: 780px;
	text-align: center;
}
#D {
	height: 400px;
	width: 700px;
	float: left;
	background-image: url(http://free0.hiboox.com/images/0711/bef02789dcb571c3631761858327c606.jpg);
}
#E {
	float: left;
	width: 80px;
	text-align: right;
}
#F {
	float: left;
	width: 80px;
	text-align: right;
}
#G {
	float: left;
	width: 80px;
	text-align: right;
}
#E1 img {
	cursor:pointer;
}
</style>
<script language="javascript">
function remplace(image) {
document.getElementById("D").innerHTML="<img src='"+image+"'>";
}
</script>
<script language="javascript">  
function affiche_text(id) {   
 
    if (id == "A"){  
        var text1 = "F";  
     }  
 
    else{  
        var text1 = "D";  
    }  
    document.getElementById("C").innerHTML = text1;
	}  
</script>
<script type="text/javascript">
function Change_image(img,new_img) {
img.src = new_img;
}
</script>	
</head>

<body>
<div id="A">
  <div id="B">
  <img src="http://free0.hiboox.com/images/0711/e8debc11d15a35594f299fae2c5b01cc.jpg" onclick="affiche_text('A');" width="41" height="12" />&nbsp;&nbsp;
  <img src="http://free0.hiboox.com/images/0711/e8debc11d15a35594f299fae2c5b01cc.jpg" onclick="affiche_text('');" width="42" height="12" /></div>
  <div id="C">F</div>
  <div id="D"></div>
  <div id="E"><img
src="http://free0.hiboox.com/images/0711/bef02789dcb571c3631761858327c606.jpg"
onclick="Change_image(this,'http://free0.hiboox.com/images/0711/e8debc11d15a35594f299fae2c5b01cc.jpg');"
height="40" width="70"><br>
<br></div>
<div id="F">
<img src="http://free0.hiboox.com/images/0711/bef02789dcb571c3631761858327c606.jpg"
onclick="Change_image(this,'http://free0.hiboox.com/images/0711/e8debc11d15a35594f299fae2c5b01cc.jpg');"
height="40" width="70"><br>
<br></div>
</div>
</body>

Modifié par qwertz1 (17 Feb 2011 - 10:41)
Après avoir effectué quelques recherche, apparament il y aurait une solution avec ceci:

var tImg = [];
var langue = "francais";
tImg["francais"] = [ "image_fr_1.jpg", "image_fr_2.jpg", "image_fr_3.jpg"];
tImg["allemand"] = [ "image_de_1.jpg", "image_de_2.jpg", "image_de_3.jpg"];


Mais malheureusement je ne sais pas comment réécrire la fonction dans mon code.

Une personne aurait l'amabilité de m'aide?

<style type="text/css">
#A {
	width: 780px;
	margin-right: auto;
	margin-left: auto;
	line-height: 13px;
}
#B {
	text-align: center;
	width: 780px;
	font-family: "Lucida Grande";
	line-height: 16px;
}
#C {
	width: 780px;
	text-align: center;
}
#D {
	height: 400px;
	width: 700px;
	float: left;
	background-image: url(http://data.imagup.com/5/1112518499.jpg);
}
#E {
	float: left;
	width: 80px;
	text-align: right;
}
#F {
	float: left;
	width: 80px;
	text-align: right;
}
#G {
	float: left;
	width: 80px;
	text-align: right;
}
#E1 img {
	cursor:pointer;
}
</style>
<script language="javascript">
function remplace(image) {
document.getElementById("D").innerHTML="<img src='"+image+"'>";
}
</script>
<script language="javascript">  
function affiche_text(id) {   
 
    if (id == "A"){  
        var text1 = "F";  
     }  
 
    else{  
        var text1 = "D";  
    }  
    document.getElementById("C").innerHTML = text1;
	}  
</script>
</head>
 
<body>
<div id="A">
  <div id="B">
  <img src="http://data.imagup.com/2/1105182592.png" onclick="affiche_text('A');" width="41" height="12" />&nbsp;&nbsp;
  <img src="http://data.imagup.com/3/1105182610.png" onclick="affiche_text('');" width="42" height="12" /></div>
  <div id="C">F</div>
  <div id="D"></div>
  <div id="E"><img
src="http://data.imagup.com/5/1112518499.jpg"
onclick="remplace('http://data.imagup.com/5/1112518499.jpg');"
height="40" width="70"><br>
<br></div>
  <div id="F">
<img src="http://data.imagup.com/4/1112527767.jpg"
onclick="remplace('http://data.imagup.com/4/1112527767.jpg');"
height="40" width="70"><br>
<br></div>
<div id="G">
<img src="http://data.imagup.com/5/1112518598.jpg"
onclick="remplace('http://data.imagup.com/5/1112518598.jpg');"
height="40" width="70"><br>
  </div>
</div>
</body>
</html>