chargement image dynamiquement

Version imprimable

03/05/2006, 22h40
franc3

chargement image dynamiquement
Bonjour,

J'ai un problème avec le chargment d'une image en javascript :

sur ma page, j'ai une image affichée, et je voudrais qu'elle change lorsqu'on clique sur un lien.

J'ai donc fait une fonction pour modifier l'image :
Code:

1 2 3 4 function changeImage(url){ document.getElementById("id_de_mon_image").src=url; }
lorsque j'affiche ma page, la première photo s'affiche normalement, quand je clique sur le lien qui appelle la fonction changeImage(), la première photo disparait, mais la deuxième ne s'affiche pas. Par contre, si je fait un clic droit à l'emplacement de la photo puis "afficher l'image" (sous IE), là la photo apparait correctement.

J'ai essaye de charger du texte à la place de la photo (une div et innerHTML) et la tout se passe sans problèmes, donc je ne comprends pas d'ou peut venir ce problème.

Si quelqu'un à une idée, elle sera la bienvenue,

merci beaucoup
03/05/2006, 22h51
franc3

Je viens de faire le test sous Firefox, et le chargement de la nouvelle image se fait sans problemes, donc a priori un beug d'IE. Est ce que quelqu'un a déjà entendu parler de ce beug, et si oui y a t il une solution??

Merci
04/05/2006, 01h43
masu

IE a effectivement un bug avec getElementById
http://www.developpez.net/forums/sho...d.php?t=135604
mais il ne se produit que si tu as 2 elements avec le meme id dans ta page ou un element avec un name identique a l'id que tu cherche.

je suis pas sure que ca soit ton cas.
peu tu donner le HTML ou un lien ou on peu voir le probleme ?

Non mon probleme ne vient pas de ce beug là, le problème n'est pas de trouver l'element, mais seulement de la nouvelle image qui apparait.

J'ai essaye une autre solution :

Mon HTML : (généré par PHP mais ça ne change rien) :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
 
 
 
 
<a href='javascript:;' onclick='changeImageCarteMeteo("<a href="http://www2.wetter3.de/Fax/bracknell+00.gif&quot;)&#39;" target="_blank">http://www2.wetter3.de/Fax/bracknell+00.gif")'</a>><div style="margin-left:40px">Analyse des fronts +00
 
 
</div></a>
 
 
 
<a href='javascript:;' onclick='changeImageCarteMeteo("<a href="http://www2.wetter3.de/Fax/bracknell+24.gif&quot;)&#39;" target="_blank">http://www2.wetter3.de/Fax/bracknell+24.gif")'</a>><div style="margin-left:40px">Analyse des fronts +24
 
 
</div></a>
 
 
 
<div class='ELListe' id='divImageCarteMeteo' ><div style="margin-left:40px"><a href='http://www2.wetter3.de/Fax/bracknell+00.gif' target='_blank'>
<img name='imagesCarteMeteo' id='imagesCarteMeteo' src='http://www2.wetter3.de/Fax/bracknell+00.gif' class='imageCarteMeteo'>
</a>
 
 
</div></div>

et mon code JS :

Code:

1
2
3
4
5
6
function changeImageCarteMeteo(carte){
 

document.getElementById("imagesCarteMeteo").src=carte;
}

j'ai aussi essaye , mais sans plus de résultats :

Code:

1
2
3
4
5
6
7
8
 

function changeImageCarteMeteo(carte){varimage = new Image();
image.src=carte;
document.getElementById("imagesCarteMeteo").src=image.src;

}

et même

Code:

1
2
3
4
5
6
7
8
 

function changeImageCarteMeteo(carte){document.getElementById("divImageCarteMeteo").innerHTML="<a href=\""+carte+"\" target=\"_blank\">"+
"<img id=\"imagesCarteMeteo\" src=\""+carte+"\" width=\"370px\" border=\"0\">"+
"</a>";
}

Dans le dernier cas, le lien de l'image change bien, la première image n'est plus affichée, mais la deuxième n'apparait toujours pas, sauf si je clic droit puis "afficher images"

04/05/2006, 11h16
masu
j'y avait pas persé de suite a celle la.
met un herf="#" dans tes lien et inactive leur action par le retur false apres l'apel de ta fonction
Code:

1 2 3 <a href="#" onclick="changeImageCarteMeteo('http://www2.wetter3.de/Fax/bracknell+00.gif'); return false;"> Analyse des fronts +00 </a>
04/05/2006, 11h40
denisC

Citation:

Envoyé par franc3

lorsque j'affiche ma page, la première photo s'affiche normalement, quand je clique sur le lien qui appelle la fonction changeImage(), la première photo disparait, mais la deuxième ne s'affiche pas. Par contre, si je fait un clic droit à l'emplacement de la photo puis "afficher l'image" (sous IE), là la photo apparait correctement.

Il vaut beaucoup mieux précharger les images avec IE. C'est dans quel cadre que tu souhaites afficher cette image? Tu as un ensemble fini d'images? C'est du dynamique?
04/05/2006, 12h11
franc3

Super ça marche, merci beaucoup Masu

Si vous voulez voir le site, voici l'adresse (encore en developpement, beaucoup de fonctions ne marchent pas) :

http://www.sudisteam.com/start/

C'etait pour le module "cartes meteo" colonne de gauche

merci encore à tous