WebKnutselaarsHulpjes
CSS buttons Diashow 1 Diashow 2 Imagemap JS-Klokje Kleuren Laadtijd Meta-tags Mouseover Popups 1 Popups 2 Popups 3 Textures Reactie Home
Foto in Popup venster
Afbeelding in nieuw venster met de afmeting van de afbeelding.
Klik op de plaatjes om de foto groter te zien.
Hiervoor wordt onderstaand stukje code gebruikt:
In het <head> gedeelte:
<script language="javascript" type="text/javascript"><!--
function fotopop(foto, alttekst, breed, hoog) {
venster=window.open
('','','width='+breed+',height='+hoog+',left=10,top=10,screenY=10,screenX=10');
with(venster.document) {
open();
write('<head><title>'+alttekst+'<\/title><\/head>\n');
write('<body background="img\/fotos\/'+foto+'" marginwidth=0 marginheight=0 style="margin:0;"
onBlur="window.close()">\n');
write('<\/body><\/html>');
close();
}
}
// -->
</script>
img/fotos/ is het pad naar de afbeelding
In het <body> gedeelte:
<a href="#" onClick="fotopop('gebouw01.jpg','Foto gebouw 1 groot','400','367'); return false;"><img src="img/fotos/gebouw01_thn.jpg" width=164 height=150 alt="Foto gebouw 1 klein" border="1"></a>Dit stukje,
onClick="fotopop('gebouw01.jpg','Foto gebouw 1 groot','400','367');,
is waar het om gaat voor wat betreft de instellingen.
'gebouw01.jpg' is de afbeelding die in de pop-up moet komen.
'Foto gebouw 1 groot' is de alt-tekst, die ook als titel wordt gebruikt.
'400' en '367' zijn de breedte en de hoogte van de afbeelding.
