Hallo,
ich bin ein wenig überfordert mit dieser Thematik, daher dachte ich mein Problem hier zu posten um eine Lösung zu erhalten.
Zu meinem Problem:
Ich beabsichtige eine kleine Bildergalerie zu erstellen. Als Startseite soll eine Gesamtübersicht über alle verfügbaren Bilder erscheinen, welche als Thumbnails dargestellt werden. Diese Thumbnails sollen beim draufklicken als PopUp vergrößert erscheinen. Da ich jedoch keinen Nerv und auch nicht den Platz habe mehrere hundert HTML-Seiten für die einzelnen PopUps zu basteln, wird jedes PopUp-Fenster über ein im Netz gefundenes JavaScript geöffnet (siehe Code unten). Nun ist es aber so, dass ich, wie aus dem Code ersichtlich, nicht nur die Funktion zum schlißen des PopUp-Fensters in dem jeweils generierten Fensterchen haben will, sondern auch eine Funktion, mit der ich im PopUp-Fenster auch vorwärts und rückwärts innerhalb der vergrößerten Bilder navigieren kann - sprich ein Vorwärts-/Rückwärtsschalten um zum jeweils nächsten oder zurückliegenden Bild zu gelangen.
Hier der bereits bestehende Code der Galerieseite:
Ich würde mich sehr freuen, wenn dieses Problem lösbar ist und jemand sich dessen annimmt.
Hier habe ich noch den bestehenden Code ins Netz gestellt: Testseite
Danke im Voraus,
ehnatnor
ich bin ein wenig überfordert mit dieser Thematik, daher dachte ich mein Problem hier zu posten um eine Lösung zu erhalten.
Zu meinem Problem:
Ich beabsichtige eine kleine Bildergalerie zu erstellen. Als Startseite soll eine Gesamtübersicht über alle verfügbaren Bilder erscheinen, welche als Thumbnails dargestellt werden. Diese Thumbnails sollen beim draufklicken als PopUp vergrößert erscheinen. Da ich jedoch keinen Nerv und auch nicht den Platz habe mehrere hundert HTML-Seiten für die einzelnen PopUps zu basteln, wird jedes PopUp-Fenster über ein im Netz gefundenes JavaScript geöffnet (siehe Code unten). Nun ist es aber so, dass ich, wie aus dem Code ersichtlich, nicht nur die Funktion zum schlißen des PopUp-Fensters in dem jeweils generierten Fensterchen haben will, sondern auch eine Funktion, mit der ich im PopUp-Fenster auch vorwärts und rückwärts innerhalb der vergrößerten Bilder navigieren kann - sprich ein Vorwärts-/Rückwärtsschalten um zum jeweils nächsten oder zurückliegenden Bild zu gelangen.
Hier der bereits bestehende Code der Galerieseite:
Code:
<html>
<head>
<title>Neue Seite 1</title>
<SCRIPT LANGUAGE="JavaScript">
<!--- Hide script from old browsers
function OpenNewWindow(cPicture,nWidth,nHeight,nBorder)
{
NewWindow=window.open("","NeuEins","HEIGHT="+nHeight+",WIDTH="+nWidth+",scrollbars=no,resizable=no,top=5,left=5");
NewWindow.document.write ("<HTML><HEAD><TITLE>Image-PopUp");
NewWindow.document.write ("</TITLE></HEAD>");
NewWindow.document.write ("<BODY BGCOLOR='White'>");
NewWindow.document.write ("<P ALIGN=CENTER>");
NewWindow.document.write ("<FONT FACE='Arial' SIZE='+2' COLOR='White'><B>");
NewWindow.document.write ("</B></FONT>");
NewWindow.document.write ("<IMG SRC=");
NewWindow.document.write (cPicture);
NewWindow.document.write (">");
NewWindow.document.write ("</P>");
NewWindow.document.write ("<center><FORM><INPUT TYPE='button' VALUE='Fenster zu' onClick='self.close()'>");
NewWindow.document.write ("</FORM></CENTER></BODY></HTML>");
NewWindow.document.write ("</BODY></HTML>");
NewWindow.document.close();
return false;
}
// end hiding from old browsers -->
</SCRIPT>
<style type="text/css">
<!--
BODY {
scrollbar-base-color: #FFFFFF;
scrollbar-track-color: #FFFFFF;
scrollbar-face-color: #FFFFFF;
scrollbar-highlight-color: #FFFFFF;
scrollbar-3dlight-color: #8FBBD5;
scrollbar-darkshadow-color:;
scrollbar-shadow-color: #549AC0;
scrollbar-arrow-color: #226286;
}
-->
</style>
</head>
<body TOPMARGIN=0 LEFTMARGIN=0 MARGINWIDTH=0 MARGINHEIGHT=0>
<table border="0" width="575" id="table1" cellspacing="1">
<tr>
<td width="575" align="center">
</td>
</tr>
<tr>
<td width="575" align="center">
<a href=# onClick="OpenNewWindow('images/Ristedt_03_003.jpg',500,400);return false;">
<img border="2" src="images/Ristedt_03_003_small.jpg" xthumbnail-orig-image="images/Ristedt_03_003.jpg"></a>
<a href=# onClick="OpenNewWindow('images/Ristedt_03_002.jpg',500,400);return false;">
<img border="2" src="images/Ristedt_03_002_small.jpg" xthumbnail-orig-image="images/Ristedt_03_002.jpg"></a>
<a href=# onClick="OpenNewWindow('images/Ristedt_03_001.jpg',500,400);return false;">
<img border="2" src="images/Ristedt_03_001_small.jpg" xthumbnail-orig-image="images/Ristedt_03_001.jpg"></a></td>
</tr>
<tr>
<td width="575" align="center">
</td>
</tr>
</table>
<p> </p>
<p> </p>
<p> </p>
</body>
</html>Hier habe ich noch den bestehenden Code ins Netz gestellt: Testseite
Danke im Voraus,
ehnatnor
Zuletzt bearbeitet:
