Bonjour à tous
vaness :
Pour agrandir une photo en cliquant sur une vignette, voici un code :
Dans le <head>
<SCRIPT LANGUAGE="JavaScript">
<!--
function PopupImage(image) {
var titre="";
var texte="";
var imgtitle="";
var alt="";
var style="popup.css";
var h = 250;
var l = 250;
var mh = 60;
var mv = 20;
var ln = 10;
var hn = 30;
var lfm,hfm,hautfm,gauchefm;
if (typeof self.innerHeight != 'undefined')
{
ln2 = self.outerWidth-document.body.offsetWidth;
hn2 = self.outerHeight-self.innerHeight;
hautfm = self.screenY;
gauchefm = self.screenX;
lfm = self.outerWidth-ln2;
hfm = self.innerHeight+hn2;
}
else if (typeof document.documentElement != 'undefined' && document.documentElement.clientHeight != 'undefined')
{
hautfm = window.center;
gauchefm = window.center;
lfm = document.documentElement.clientWidth-ln;
hfm = document.documentElement.clientHeight-hn;
}
else if (typeof document.body != 'undefined')
{
hautfm = window.center;
gauchefm = window.center;
lfm = document.body.clientWidth-ln;
hfm = document.body.clientHeight-hn;
}
var PosX = Math.round(( hfm - h ) / 2)+hautfm;
var PosY = Math.round(( lfm - l ) / 2)+gauchefm;
var option = "resizable,toolbar=no,scrollbars=no,top="+PosX+",left="+PosY+",width="+l+",height="+h+"";
w=open('',"titre",option);
w.document.write("<!DOCTYPE html PUBLIC '-//W3C//DTD XHTML 1.0 Transitional//EN' 'http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd'>");
w.document.write("<html xmlns='http://www.w3.org/1999/xhtml'>");
w.document.write("<meta http-equiv='Content-Type' content='text/html; charset=iso-8859-1' />");
w.document.write("<html><head><title>"+titre+"</title></head>");
w.document.write("<link href='"+style+"' rel='stylesheet' type='text/css' />");
w.document.write("<script type=text/javascript>function checkSize() { if (document.images[0].width > 1 && document.images[0].height > 1) { window.resizeTo(document.images[0].width+"+ln+"+"+mv+",document.images[0].height+"+hn+"+"+mh+")} else { setTimeout('checksize()',250) } }</"+"script>");
w.document.write("<script type=text/javascript>function centerPopup() { window.moveTo(Math.round(("+lfm+"-(document.images[0].width+"+mv+"))/2)+"+gauchefm+",Math.round(("+hfm+"-(document.images[0].height+"+mh+"))/2)+"+hautfm+");}</"+"script>");
w.document.write("<body onload='checkSize();centerPopup()' onblur='window.close()' onclick='window.close()'>");
w.document.write("<div class='cadreh'></div><div class='cadreg'></div><div class='cadrec'><img src='"+image+"' class='image' alt='"+alt+"' title='"+imgtitle+"'></div><div class='cadred'></div><div class='cadreb'><div class='legende'>"+texte+"</div></div>");
w.document.write("</body></html>");
w.document.close();
} // -->
</SCRIPT>
Dans le< body> à l'endroit de la photo :
<a onclick="PopupImage(this.href);return false;" href="grande_photo.jpg"><img src="petite_photo.jpg"</a></td>
