Pb affichage dynamique image

Version imprimable

Bonjour à tous,

j'ai un petit problème d'affichage dynamique d'une image.

Je m'explique, j'ai un <input type='file' .../>, l'utilisateur choisi une image.

Une fois l'image choisie, en javascript je crée un élement de type img et je mets en attribut 'src' la value de l'input. J'ai bien une balise qui s'ajoute avec une icone genre 'image non trouvée' alors que si je clic dessus et je fais afficher l'image elle s'affiche correctement dans une nouvelle fenêtre.

Voiçi le code que j'execute :
Code:

1 2 3 4 5 6 container = document.getElementById('container'); newBackground = document.createElement('img'); newBackground.src = fileLink; //fileLink correspond à la value de la balise input file newBackground.id = "imageBackground"; container.appendChild(newBackground);
une idée ?

Merci

26/04/2006, 14h01
siddh

as tu essayé avec un new Image ?
26/04/2006, 14h01
denisC

Citation:

Envoyé par partyboy

une idée ?

Non, il faudrait précharger l'image au chargement de ta page, mais comme tu ne la connais pas....

Seule solution (à tester) précharger l'image quand l'utilisateur la choisit, et ne l'insérer que légèrement plus tard (setTimeout).
26/04/2006, 14h33
partyboy

Je viens d'essayer avec le new Image et ca ne fonctionne pas ...

je vais essayer de voir du coté du preload.

si qqun a eventuellement une autre idée, je suis preneur :roll:
26/04/2006, 15h16
denisC

Citation:

Envoyé par partyboy

Je viens d'essayer avec le new Image et ca ne fonctionne pas ...

je vais essayer de voir du coté du preload.

si qqun a eventuellement une autre idée, je suis preneur :roll:

new Image == preload.

Pour moi, tu fais un new Image (avec le bon src), tu attends un peu, et tu l'affiches dans ta page (setTimeout).

J'ai modifié mon code comme ceci, mais toujours rien :

Code:

1
2
3
4
5
6
7
8
9
10
11
 
newImg = new Image();
              newImg.src = fileLink;
              container = document.getElementById('container');
              newBackground = document.createElement('img');
 
              //newBackground.src = fileLink;
              newBackground.src = newImg.src;
              newBackground.id = "imageBackground";
              newBackground.name = "imageBackground";
              setTimeout("container.appendChild(newBackground)",2000);

J'ai peut être pas très bien compris l'utilisation de new Image() aussi.

26/04/2006, 16h14
denisC

Citation:

Envoyé par partyboy

J'ai peut être pas très bien compris l'utilisation de new Image() aussi.

Si c'est bon. J'aurais mis le timeout avant la création du noeud DOM.... Essaye, on sais jamais :)
26/04/2006, 16h18
partyboy

Bon, ca fait toujours pareil :?

Au secours ! :aie:

C'est juste le fait que javascript doit connaitre l'url de toutes les images a priori ?
26/04/2006, 17h01
denisC

Citation:

Envoyé par partyboy

C'est juste le fait que javascript doit connaitre l'url de toutes les images a priori ?

Non, c'est juste que IE est nul.... Tu utilises IE, non? Essaye avec Firefox, tu auras des problèmes de sécurité, mais pas celui-ci d'affichage (enfin, si tu arrives jusqu'à cette étape).
26/04/2006, 17h08
partyboy

Arghhhh ! non pas IE 8O

j'utilise Firefox ;)

bien que l'appli doit fonctionner sous IE et Firefox.

Donc non, ca ne fonctionne pas sous Firefox ...sniff
26/04/2006, 17h14
partyboy

j'ai essayé d'afficher une image qui était sur le serveur (url relative) et ca fonctionne sans pb.
26/04/2006, 17h31
javatwister

le pb vient du déclenchement de la fonction: quel événement? quel objet gestionnaire?
26/04/2006, 17h35
partyboy

En fait j'ai un évenement onchange sur mon <input type='file'.../>

C'est sur l'onchange que je lance la fonction qui récupere l'url et essaye d'afficher l'image.
26/04/2006, 17h45
MasterOfChakhaL

peut être que tu peux nous faire un petit alert sur le filelink, histoire de voir...
27/04/2006, 09h33
partyboy
Alors un petit alert sur le fileLink me donne :
Code:

1 2 D:\test.png
Ce qui m'a l'air correct.