Re: Klick auf Thumbnail öffnet Pop-Up-Fenster
Hallo,
das waere mein Vorschlag, bestehend aus zwei Dateien.
BILDERGALERIE:
======================
<html>
<head>
<title>Thumbnails</title>
<style type="text/css">
<!--
body
{
margin:0px;
background-color:gray;
overflow:auto;
}
a
{
text-decoration:none;
}
-->
</style>
<script language="javascript1.2" type="text/javascript">
<!--
var strImgSource = "";
var strImgTitle = "";
var wndInst = null;
function openNewWnd(prmUrl,prmTarget)
{
if (wndInst && !wndInst.closed) {
wndInst.close()
wndInst=null;
}
if (!wndInst || wndInst.closed) {
var wndView = "resizable=no,dependent=no,scrollbars=yes,location=no,";
wndView += "menubar=no,personalbar=no,toolbar=no,status=no,";
wndView += "width=200,height=200,left=0,top=0,screenX=0,screenY=0";
wndInst = window.open(prmUrl,prmTarget,wndView);
}
}
function onShowImage(prmImgName,prmImgTitle)
{
strImgSource = self.document.images[prmImgName].src;
strImgTitle = prmImgTitle;
openNewWnd('./einzelbild.htm','_blank');
}
//-->
</script>
</head>
<body marginwidth="0" marginheight="0">
<table align="center" border="1" cellpadding="1" cellspacing="1" summary="Thumbnails">
<tr align="center">
<td valign="middle" width="110" height="70">
<a href="javascript:onShowImage('links','Das ist die Beschriftung von Bild #1')" onFocus="blur()">
<img src="./links.gif" border="0" width="103" height="61" name="links" alt="Bild 1" title="Bild 1" />
</a>
</td>
<td valign="middle" width="110" height="70">
<a href="javascript:onShowImage('shop','Das ist die Beschriftung von Bild #2')" onFocus="blur()">
<img src="./shop.gif" border="0" width="95" height="61" name="shop" alt="Bild 2" title="Bild 2" />
</a>
</td>
</tr>
</table>
</body>
</html>
EINZELBILD:
======================
<html>
<head>
<title>StandalonePic</title>
<style type="text/css">
<!--
body
{
margin:0px;
background-color:white;
overflow:auto;
}
-->
</style>
<script language="javascript1.2" type="text/javascript">
<!--
var imgObj = new Image();
var imgTxt = "";
if (window.opener) {
imgObj.src = window.opener.strImgSource;
imgTxt = window.opener.strImgTitle;
}
var strImgTag = "<img src='"+imgObj.src+"' border='0' width='"+imgObj.width+"' height='"+imgObj.height+"' name='Bild' alt='EinzelBild' title='EinzelBild' \/>"
var strParaTag = "<p>"+imgTxt+"<\/p>";
//-->
</script>
</head>
<body marginwidth="0" marginheight="0">
<table border="0" width="100%" height="100%" cellpadding="0" cellspacing="0" summary="OuterTable">
<tr align="center"><td valign="middle">
<table border="0" cellpadding="1" cellspacing="1" summary="InnerTable">
<tr align="center"><td valign="middle">
<script language="javascript1.2" type="text/javascript">
<!--
window.document.write(strImgTag);
//-->
</script>
</td></tr>
<tr align="center"><td valign="middle">
<script language="javascript1.2" type="text/javascript">
<!--
window.document.write(strParaTag);
//-->
</script>
</td></tr>
</table>
</td></tr>
</table>
</body>
</html>
