fonction Popup Image

Version imprimable

bonjour,

voici une fonction PopupImage qui affiche l'image en popup.
Code:

1 2 3 4 5 6 7 8 9 <SCRIPT LANGUAGE="JavaScript"> function PopupImage(img) { w=open("",'image','weigth=toolbar=no,scrollbars=no,resizable=yes,width=300,height=300'); w.document.write("<BODY onblur=\"window.close();\"><IMG src='"+img+"'"); w.document.write("</BODY>"); w.document.close(); } </script> <A href="javascript:PopupImage('1.jpg')"> <img src="2.jpg" border='0' /></A> </td>
je veux quand j'appel la fonction le popup prend la forme de l'image si l'image a width='300' height='300' o popub s'affiche en taille de l'image width='300' height='300' . et Merci.

heu si j'ai bien compris la question tu veux adapter la taille de ta popup en fonction de celle de l'image :

Code:

1
2
3
4
5
6
7
8
9
10
11
 
<SCRIPT LANGUAGE="JavaScript">
function PopupImage(img) {
var largeur = img.width ;
var hauteur = img.height;	w=open("",'image','weigth=toolbar=no,scrollbars=no,resizable=yes,width=largeur ,height=hauteur');	
	w.document.write("<BODY onblur=\"window.close();\"><IMG src='"+img+"'");
	w.document.write("</BODY>");
	w.document.close();
}
</script>
<A href="javascript:PopupImage('1.jpg')"> <img src="2.jpg" border='0'  /></A>&nbsp;</td>

Voila :) bon courage

06/02/2008, 15h13
niceen

La meme chose mon ami. rien n'a changé

Pardon ... je pensais que tu aurais adapté le code je l'ai donné grossièrement
Voila testé et approuvé

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Document sans nom</title>
<script type="text/javascript">
function PopupImage(img) {
var largeur = img.width ;
var hauteur = img.height;	
w=open("",'image','weigth=toolbar=no,scrollbars=no,resizable=yes,width='+largeur+' ,height='+hauteur);	
	w.document.write("<BODY onblur=\"window.close();\"><IMG src='"+img.src+"'");
	w.document.write("</BODY>");
	w.document.close();
}
</script>
</head>
 
<body>
 
<img src="LIENDETONIMAGE" border='0' onclick="PopupImage(this)"  />
</body>
</html>

celui ci fontionne ;)

06/02/2008, 16h06
niceen

Merci Mon ami pour ton réponse mais il reste la meme chose avec ce code là:
dans le lien je reduits la taille de l'image width="100" et height="100" mais quand je click sur elle je veux l'aficher image avec sa taille normale si l'image a 250 en width et 300 en height le popup va prendre cette taille et afficher image .et merci

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Document sans nom</title>
<script type="text/javascript">
function PopupImage(img) {
var largeur = img.width ;
var hauteur = img.height;
w=open("",'image','weigth=toolbar=no,scrollbars=no,resizable=yes,width='+largeur+' ,height='+hauteur);
w.document.write("<BODY onblur=\"window.close();\"><IMG src='"+img.src+"'");
w.document.write("</BODY>");
w.document.close();
}
</script>
</head>

<body>

<img src="p.jpg" border='0' onclick="PopupImage(this)" width="100" height="100"/>
</body>
</html>
06/02/2008, 16h17
le_chomeur

La a part génèrer une miniature , ou récupèrer la taille de l'image avant de la charger ... :oops:
06/02/2008, 16h21
sachav

Ce serait pas plutot img.style.width ?
06/02/2008, 16h23
sachav

Ah non, j'ai rien dit...
Il faut creer un span invisible (visibility: hidden; position: absolute; left: -3000 et top: -3000), inserer l'image a l'interieur, et on peut recuperer la taille de l'image... En plus elle sera encore dans la cache du browser au chargement de la popup, donc plus rapide a charger !