11484 sujets

JavaScript, DOM et API Web HTML5

Afficher une image dans un pop-up en utilisant DOM et JavaScript

Bonjour à toutes et tous, Smiley smile

J’ai besoin de vos lumières.

Je tente d’afficher une image dans un pop-up de manière dynamique en utilisant DOM et JavaScript.

Ça marche dans IE7 mais pas sur FireFox.
C’est vari que nous avons tous l’habitude du contraire, mais c’est comme ça. Smiley biggrin

Une précision importante dans IE7 ça marche bien quelque soit l’élément ajouté dynamiquement ‘img’,’ h1’,’p’…
Dans FireFoxe ça marche avec tous les éléments sauf l’élément ‘img’ c’est pour ça que dans mon script je me concentre maintenant sur l’élément ‘img’.

Voici mon script

function ouvre_Popup(){
	myRef=window.open('','mywin','left=20,top=20,width=500,height=500,toolbar=1,resizable=0');
	eltBody=myRef.document.getElementsByTagName('body');
	lstImg=myRef.document.getElementsByTagName('img');//contient t'il une image(le popup est deja lancé)
	if(lstImg.length==0){//sipas d'image en créer une
		eltImg=myRef.document.createElement('img');
		eltBody[0].appendChild(eltImg);
		eltImg.src=('images/_AD01.jpg');
	}
	else lstImg[0].src=('images/_AD02.jpg');// si une image existe changer la source	
}


La partie html est la suivante :

<form>
  <input type="button" value="test" onclick="ouvre_Popup()">
</form>


Si vous avez des explications à ce phénomène je suis preneur. Smiley cligne
Je viens de test ton code sur mon navigateur (firefox 2.0.0.16), et tout marche bien.

<html>

<head>
<script type="text/javascript">
function ouvre_Popup(){

myRef=window.open('','mywin','left=20,top=20,width=500,height=500,toolbar=1,resizable=0');

eltBody=myRef.document.getElementsByTagName('body');

lstImg=myRef.document.getElementsByTagName('img');//contient t'il une image(le popup est deja lancé)

if(lstImg.length==0){//sipas d'image en créer une

eltImg=myRef.document.createElement('img');


eltBody[0].appendChild(eltImg);
eltImg.src=('http://tfeserver.homelinux.com/dl/images/screenshots/wanadoosux.jpg');
eltImg.alt='test';

}

else lstImg[0].src=('images/_AD02.jpg');// si une image existe changer la source

}
</script>

</head>

<body>


<form>

<input type="button" value="test" onclick="ouvre_Popup()">

</form>
</body>
</html>[code]
Merci beaucoup tfe Smiley smile

Je viens de débloquer les pop-up dans FireFox 3.0.1 ça marche Smiley confused

Maintenant, ce que je ne comprend pas c'est que l'antipop-up de FireFox 3.0.1 ne bloque que les images générées dynamiquement avec DOM:createElement(...) et pas les élément image générés par la méthode document.write(...) Smiley rolleyes

Avez vous une explication Smiley confused

Merci d'avance Smiley smile
Bien

J'ai trouvé d'ou ça vient.

ça n'a rien àvoir avec le bloqueur de pop-up.

C'est l'url de l'image.

Il faut que ça soit de type 'http://serveur/../image.jpg'

Bon je crois que c'est ça Smiley confused
Merci tfe pour ta contribution Smiley smile

Ceci prouve que 1 idée + 1 idée vaut plus que 2 Smiley cligne

Pour l’histoire,

Le blocage n’avait rien à voir avec le bloqueur de pop-up de FireFox. c'était un délire de ma part Smiley lol

FireFox n’aime pas les scripts qui font ça :

Mon_popup  = window.open('','mywin','left=20,top=20,width=500,height=500,toolbar=1,resizable=0');
eltImg =  Mon_popup .document.createElement('img');
eltImg.src = ('images/image.jpg'); //chemin local


Il préfère plutôt ça:

Mon_popup = window.open('','mywin','left=20,top=20,width=500,height=500,toolbar=1,resizable=0');
eltImg = Mon_popup .document.createElement('img');
eltImg.src = ('http://url_site/images image.jpg');//url web


La différence est dans le chemin vers la ressource image.

Merci beaucoup Smiley cligne
Sujet clos
Aller à