Klick auf Thumbnail öffnet Pop-Up-Fenster

Computer: Software & Programmierung JavaScript & Script-Sprachen
1

Ich bin gerade dabei, Bilder in meine Homepage zu integrieren, und zwar Thumbnails, die sich auf Klick im Großformat öffnen. Bisher habe ich es so gelöst, dass beim Klick auf einen Thumbnail eine neue Seite geöffnet wird, auf der sich nur das zugehörige große Bild befindet.
Wie würde das Java-Script, mit dem ich das Bild in einem Pop-Up-Fenster öffnen kann, lauten? Wie kann ich eine Bildunterschrift zum jeweiligen Bild im Pop-Up-Fenster hinzufügen?

2

Hallo,

das waere mein Vorschlag, bestehend aus zwei Dateien.

BILDERGALERIE:

Thumbnails
<!–

body
{
margin:0px;
background-color:gray;
overflow:auto;
}

a
{
text-decoration:none;
}

–>

<!–

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’);
}

//–>

[
](javascript:onShowImage(‚links‘,‚Das%20ist%20die%20Beschriftung%20von%20Bild%20#1‘))

[
](javascript:onShowImage(‚shop‘,‚Das%20ist%20die%20Beschriftung%20von%20Bild%20#2‘))

EINZELBILD:

StandalonePic
<!–

body
{
margin:0px;
background-color:white;
overflow:auto;
}

–>

<!–

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>";

//–>

<!–
window.document.write(strImgTag);
//–>

<!–
window.document.write(strParaTag);
//–>