Photo coupée en pop-up

Version imprimable

Bonjour à tous,

J'ai besoin de votre aide, je ne trouve pas de solution :cry:

J'utilise le lien suivant

Code:

1
2
3
 
<a href="javascript:PopupImage('Photos/small_image12')">
<img src="Photos/image12.jpg" /a>

ce lien appelle la fonction javascript suivante :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
 
<SCRIPT LANGUAGE="JavaScript">
<!--
function PopupImage(img) { 
 
titre="Photo"; 
w=open("",'image','width=400,height=400,toolbar=no,scrollbars=no,resizable=no');
w.document.write("<HTML><HEAD><TITLE>"+titre+"</TITLE></HEAD>"); 
w.document.write("<SCRIPT language=javascript>function place() { var X = document.body.clientHeight; var Y = document.body.clientWidth;var T=Math.round((screen.availHeight-X)/2);var L=Math.round((screen.availWidth-Y)/2);self.moveTo(L,T)}</script><SCRIPT language=javascript>function checksize() { if (document.images[0].complete) { window.resizeTo(document.images[0].width+10,document.images[0].height+30); window.focus()} else { setTimeout('checksize()',250) } }</"+"SCRIPT>"); 
w.document.write("<BODY onload='checksize();place()' leftMargin=0 topMargin=0 marginwidth=0 marginheight=0>");
w.document.write("<TABLE width='100%' border='0' cellspacing='0' cellpadding='0' height='100%'><TR>");
w.document.write("<TD valign='middle' align='center'><IMG src='"+img+"' border=0 alt='Picture'>"); 
w.document.write("</TD></TR></TABLE>");
w.document.write("</BODY></HTML>"); 
w.document.close(); 
} 
//-->
</SCRIPT>

Et voici mon problème : lorsque je clique sur ce lien afin d'ouvrir la photo en pop-up, celle-ci ne s'ouvre qu'à moitié(une grande partie de la photo est coupée).

Quelle est la solution pour afficher cette photo entièrement?

Merci d'avance.

18/06/2007, 12h01
SpaceFrog

mercie de regarder les contributions il y a un post consacré aux popup images ???

et puis le suite de document.write ... heu :vomi:
18/06/2007, 12h14
Sophie2097

un peu de précision p-e, je n'ai rien trouvé

Salut

Essaye de remplacer ca :

Code:

1
2
3
 
<a href="javascript:PopupImage('Photos/small_image12')">
<img src="Photos/image12.jpg" /a>

par ca

Code:

1
2
3
 
<a href="javascript:PopupImage('Photos/small_image12')">
<img src="Photos/image12.jpg" alt="" /></a>

Pitite erreur de syntaxe

19/06/2007, 17h14
Sophie2097

je vois pas ce que

Code:

alt""

changerait. J'ai malgré tout essayé et rien n'a changé, la photo est toujours coupée.
19/06/2007, 17h22
SpaceFrog

tu as essayé de faire un resizeTo de la popup avec les dimensions de ton image ?

sur le onload du popup récupères le offsetHeight et offsetWidth de ton image et attribues les en resize à la popup ...
19/06/2007, 17h32
Sophie2097

c'est possible d'avoir un bout de code parce que là je suis un peu perdue

Voilà mon code actuel

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
<SCRIPT LANGUAGE="JavaScript">
<!--
function PopupImage(img) { 
 
titre="Photo"; 
w=open("",'image','width=400,height=400,toolbar=no,scrollbars=no,resizable=no');
w.document.write("<HTML><HEAD><TITLE>"+titre+"</TITLE></HEAD>"); 
w.document.write("<SCRIPT language=javascript>function place() { var X = document.body.clientHeight; var Y = document.body.clientWidth;var T=Math.round((screen.availHeight-X)/2);var L=Math.round((screen.availWidth-Y)/2);self.moveTo(L,T)}</script><SCRIPT language=javascript>function checksize() { if (document.images[0].complete) { window.resizeTo(document.images[0].width+10,document.images[0].height+30); window.focus()} else { setTimeout('checksize()',250) } }</"+"SCRIPT>"); 
w.document.write("<BODY onload='checksize();place()' leftMargin=0 topMargin=0 marginwidth=0 marginheight=0>");
w.document.write("<TABLE width='100%' border='0' cellspacing='0' cellpadding='0' height='100%'><TR>");
w.document.write("<TD valign='middle' align='center'><IMG src='"+img+"' border=0 alt='Picture'>"); 
w.document.write("</TD></TR></TABLE>");
w.document.write("</BODY></HTML>"); 
w.document.close(); 
} 
//-->
</SCRIPT>

Voici le code modifié ...

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
25
26
27
28
<SCRIPT type="text/javascript">
<!--
function PopupImage(image) { 
 
w=open("",'image','width=400,height=400,toolbar=no,scrollbars=no,resizable=no');
w.document.body.style.margin='0px';
var ThePic=new Image();
ThePic.src=image;
var pic=w.document.createElement('img');
pic.src=ThePic.src;
w.document.body.appendChild(pic);
w.document.close(); 
if(w.document.images[0].complete){FitPic()}
else {setTimeout(function(){FitPic(image)},100)}
}
 
function FitPic(image){
var Hauteur=w.document.images[0].offsetHeight + 30
var Largeur=w.document.images[0].offsetWidth+ 10;
w.resizeTo(Largeur,Hauteur);
var scW = screen.availWidth ? screen.availWidth : screen.width;
var scH = screen.availHeight ? screen.availHeight : screen.height;
w.moveTo(Math.round((scW-Largeur)/2),Math.round((scH-Hauteur)/2));}
 
 
PopupImage('Lungs.gif')
//-->
</SCRIPT>

Juste un petit souci il ne tourne pas sous Firefox ...
J'essaye d'arranger ça ...
Si quelqu'un voit pourquoi entre deux ...

20/06/2007, 11h05
Sophie2097

Je vais tester ca de suite et je vous communique le résultat.

Un grand merci d'avance.
20/06/2007, 11h10
Sophie2097

Malheureusement les photos sont toujours autant coupées.

ca devient désespérant.
20/06/2007, 11h16
SpaceFrog

tu peux joindre un exemple de photo en pièce jointe ???
20/06/2007, 12h29
Sophie2097

1 pièce(s) jointe(s)

photo exemple en pièce jointe
20/06/2007, 12h42
Sophie2097

Avez-vous pu tester?

Testé avec ton image sans souci .
Sauf pour FFX pour lequel il ne semble pas capter le path de l'image ???

Sinon sous IE c'est nickel
Je continue de rechercher pour FFX...
Si ça ne focntionne toujours pas chez toi tu dois avoir un souci de browser ou de carte graphique ...

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
25
26
27
28
29
30
<script type="text/javascript">
<!--
var w=window.open('','image','width=400,height=400,toolbar=no,scrollbars=no,resizable=no');
 
function PopupImage(image) { 
 
var pic=w.document.createElement('img');
w.ThePic=new Image();
w.ThePic.src=image;
 
pic.src=w.ThePic.src;
w.document.body.appendChild(pic);
w.document.body.style.margin='0px';
w.document.close(); 
if(w.document.images[0].complete){FitPic()}
else {setTimeout(function(){FitPic(image)},100)}
}
 
function FitPic(image){
var Hauteur=w.document.images[0].offsetHeight + 30
var Largeur=w.document.images[0].offsetWidth+ 10;
w.resizeTo(Largeur,Hauteur);
var scW = screen.availWidth ? screen.availWidth : screen.width;
var scH = screen.availHeight ? screen.availHeight : screen.height;
w.moveTo(Math.round((scW-Largeur)/2),Math.round((scH-Hauteur)/2));}
 
 
setTimeout(function(){PopupImage('Picture_5.jpg')},500)
//-->
</script>

20/06/2007, 14h13
SpaceFrog

je trouve curieux que l'image ne s'affiche pas car FFX me retourne bien le bon path d'image ???
20/06/2007, 15h04
Sophie2097

C'est incompréhensible. J'ai testé sur 2 pc différents, et j'obtiens un résultat identique.

A chaque fois, il manque une (toute) petite partie au bas de chaque photo.
20/06/2007, 15h04
SpaceFrog

et sinon si tu mets juste la photo dasn la page ? elle est entière ?
20/06/2007, 15h05
Sophie2097

oui dans ce cas elle est entière.

serait-il possible que ca soit IE7?
21/06/2007, 11h51
Sophie2097

Plus personne n'a de solution? :cry:
21/06/2007, 11h53
SpaceFrog

je ne sais pas si il y a un volontaire pour tester le code sous IE7 ...
21/06/2007, 12h13
Sophie2097

SpaceFrog,

Tu utilises un version inférieure à IE7 et chez toi la photo s'affiche entièrement?
21/06/2007, 12h48
SpaceFrog

oui IE6 et aucun souci
je n'ai pas IE7
et sous firefox il modifie bien le src mais n'affiche pas l'image
21/06/2007, 12h56
Sophie2097

Ok, je vais tenter de trouver un pc avec IE6 pour tester cela, et je communiquerai le résultat pour cloturer cette discussion.

Merci beaucoup pr ton aide.