je code werkt perfect, ik heb eens eigen pic derin gestoken, en ça marche ..
op eerste zicht zie ik ni goe wa er scheelt, behalve de aangehaalde mogelijkheden ( spatie tss href & = , die .JPG , etc .. )
ik doe mijn thumbs wel een beetje anders, omdat ik die pic op ware grootte wat deftiger wil weergeven, en centreren enzo ..
zo dus:
http://vodde.sohosted.com/thumb
mijn manier is wel wa complexer, maar ik geef ze even ..
thumb:
PHP:
<img onmouseover="this.style.cursor='pointer'" src="thumbs/foto1.jpg" alt="foto1" onclick="openFoto(this.alt,800,600)" />
op thumb klikken roept openFoto op, met 3 parameters in :
_ this.alt -> de alt van de pic, hier dus foto1
_ 800 -> width van originele pic
_ 600 -> height van originele pic
de functie:
PHP:
function openFoto(url,w,h)
{
var winl = (screen.width - w) / 2;
var wint = (screen.height - h) / 2;
winprops = 'height='+h+',width='+w+',top='+wint+',left='+winl+'resizable=0';
window.open("popup.htm?"+url,"", winprops)
}
de functie neem de width & height, en opent gecentreerd ( adhv meegegeven width & height ) popup.htm met als querystring "foto1"
popup.htm:
PHP:
<script language='javascript'>
var arrTemp=self.location.href.split("?");
var picUrl = (arrTemp.length>0)?arrTemp[1]:"";
var NS = (navigator.appName=="Netscape")?true:false;
function fitFoto() {
iWidth = (NS)?window.innerWidth:document.body.clientWidth;
iHeight = (NS)?window.innerHeight:document.body.clientHeight ;
iWidth = document.images[0].width - iWidth;
iHeight = document.images[0].height - iHeight;
window.resizeBy(iWidth, iHeight);
self.focus();
};
</script>
<body onload='fitPic();' topmargin="0"
marginheight="0" leftmargin="0" marginwidth="0">
<script language='javascript'>
document.write( "<img src='images/" + picUrl + ".jpg' border='0' onclick='javascript:top.window.close()' />" );
</script>
</body>
bij laden van de pagina, start het script fitFoto, dat het venster zo aanpast, dat het nauw aansluit bij de originele foto .. en haalt de url van de originele foto op ..
in de body schrijft javascript dan de img tag uit, met als src de picUrl, die in fitFoto opgehaald is als "foto1" , en zet er "images/" voor en ".jpg" achter ..
zodat de foto -> images/foto1.jpg verschijnt, wat de originele foto van thumbs/foto1.jpg zou moeten zijn
om te sluiten kan je dan behalve het kruisje, ook gewoon op de pic zelf klikken ..
