Forum Clubic

Document.images.src ne fonctionne pas sous IE

Bonjour,
je travaille présentement sur une boutique virtuelle… Chaque item a une photo principale et plusieurs thumbnails, je veux que la photo principale change pour celle du thumbnail au dessus duquel la souris se trouve(mouseover).

L’attribut “name” de la photo principale est en fonction de son id, ex <img name=‘15_main’ …>
Toutes mes images sont nommées de cette facon: aa_bb_cc.jpg
aa=id de l’item
bb=numéro de la photo (1 à 10)
cc=grosseur de l’image (1=thumbnail et 2=image pleine grandeur)

Toutes les images sont créées dynamiquement avec un script PHP donc dans chaque balise d’image thumbnail j’ai ceci: onMouseOver=‘switchmain($id,$thumb)’

J’ai réussi a faire une fonction que voici, ça fonctionne parfaitement sur Firefox mais sur Internet Explorer ça ne fonctionne pas du tout.


function switchmain(id,thumb){
	var nam =[id+"_main"];
	var name=nam.join();
	var folder="/photos/";
	var fil=[folder+id+"_"+thumb+"_2"+".jpg"];
	var file=fil.join();
	  document.images[name].src = file;
}

On dirait que IE ne prends pas correctement cette partie “document.images[id + “_main”]” parce que l’image change bel et bien pour celle au dessous du pointeur mais elle ne change pas la bonne image principale

Ça fait un bail que je cherche et que j’essaye plusieurs trucs et je suis désespéré!
Merci d’avance pour l’aide

Dans un premier temps je te recommanderais d’utiliser l’extension FireBug de Firefox qui est TRES utile pour débogger du JavaScript.

Ensuite je suis pas un expert en javascript, mais j’ai déjà réalisé un script similaire, seulement le mien fonctionnait dans le principe d’une boucle incrémentée qui passait tous les éléments du type ‘item_’+i en revu et à chacun attribuait les changements nécessaires. Ce script me servait pour un slider.

Voilà, je ne t’ai pas vraiment aidé, mais je te conseil d’utiliser FireBug pour avoir un retour d’erreur javascript en live.

Dans un second temps:

function switchmain(id,thumb){
	var name=id+"_main";
	var folder="/photos/";
	var file=folder+id+"_"+thumb+"_2"+".jpg";
	 document.images[name].src = file;
}

Inutile de créer un tableau pour concaténer…

Sinon au choix, tu as :

  1. document.getElementsByName(name) qui te permet de récupérer tous les éléments nommés name
  2. document.images.XXX.src, et donc: eval(‘document.images.’ + name).src = file; (à tester, mais bref)
  3. Obi Wan Kenobi, et la Force - on la sous estime souvent.