Hallo,
ich bin neu hier und befasse mich erst seit Kurzem mit der HTML-Programmierung. AKtuell möchte ich in eine Web-Seite innerhalb eines Frames die Lightbox2.6 anwenden.
Aber was ich auch versuche, alles funktioniert nicht so wie es soll.
Hier habe ich mal die betreffenden Zeilen aus meinem HTML-Code:
Zuerst initialisiere ich die Lightbox2.6 so:
</head>
<script src="js/jquery-1.10.2.min.js"></script>
<script src="js/lightbox-2.6.min.js"></script>
Danach muss ich, und weis ich nicht so richtig, folgenden Code unterbringen:
<a href="../Bilder/2013/2013_Meran_01.jpg" data-lightbox="image-1"> image #1</a>
und zwar in folgender Zeile:
<tr>
<td align="center" width="50%"> <img src="../Bilder/2013/2013_Meran_01.jpg" alt="Ausfahrt nach Meran 2013" border="0" width="404" height="303>"></td>
Ziel des Ganzen soll sein: Kleine Vorschaubilder in einer Tabelle und beim daraufklicken soll das Bild mit dem Lightbox-Effekt aufgezoomt werden.
Kann da mal jemand darüberschauen und mir einen Tipp geben damit das Ganze wie gewünscht funktioniert?
Zum besseren Verständnis im Nachfolgenden der komplette Code der Seite in der ich die Lightbox einbauen möchte:
Code
<head>
<title>Bilder 2013 Frame MFB </title>
<meta name="author" content="Käpsele">
<meta name="editor" content="html-editor phase 5">
<meta name="keywords" content="Motorradfreunde Buchenbachtal, Winnenden, Berglen, Motorradclub, Stammtisch, Buchenbach, Biker">
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<style type="text/css">
a:hover { color:#EE453B; text-decoration:underline; background-color:none; font-size:24px; font-weight:bolder; }
</style>
</head>
<script src="js/jquery-1.10.2.min.js"></script>
<script src="js/lightbox-2.6.min.js"></script>
<link href="css/lightbox.css" rel="stylesheet" />
<body text="#EEEEEE" bgcolor="#555555" link="#0E46F9" alink="#0E46F9" vlink="#0E46F9"
marginwidth="0" marginheight="0" topmargin="0" leftmargin="0">
<font size="5">
<table width="100%" border="1" cellpadding="2" cellspacing="2">
<tr>
<td colspan="2" align="center" width="100%" > <font color="#EE453B"> <b><u> Jahresausfahrt nach Meran 2013 </u></b></font></td>
</tr>
<tr>
<td align="center" width="50%"> <img src="../Bilder/2013/2013_Meran_01.jpg" alt="Ausfahrt nach Meran 2013" border="0" width="404" height="303>"></td>
<td align="center" width="50%"> <img src="../Bilder/2013/2013_Meran_02.jpg" alt="Ausfahrt nach Meran 2013" border="0" width="404" height="303"></a></td>
</tr>
<tr>
<td align="center" width="50%"> <img src="../Bilder/2013/2013_Meran_03.jpg" alt="Ausfahrt nach Meran 2013" border="0" width="404" height="303"></a></td>
<td align="center" width="50%"> <img src="../Bilder/2013/2013_Meran_04.jpg" alt="Ausfahrt nach Meran 2013" border="0" width="404" height="303"></a></td>
</tr>
<tr>
<td align="center" width="50%"> <img src="../Bilder/2013/2013_Meran_05.jpg" alt="Ausfahrt nach Meran 2013" border="0" width="404" height="303"></a></td>
<td align="center" width="50%"> <img src="../Bilder/2013/2013_Meran_06.jpg" alt="Ausfahrt nach Meran 2013" border="0" width="404" height="303"></a></td>
</tr>
<tr>
<td align="center" width="50%"> <img src="../Bilder/2013/2013_Meran_07.jpg" alt="Ausfahrt nach Meran 2013" border="0" width="404" height="303"></a></td>
<td align="center" width="50%"> <img src="../Bilder/2013/2013_Meran_08.jpg" alt="Ausfahrt nach Meran 2013" border="0" width="404" height="303"></a></td>
</tr>
<tr>
<td align="center" width="50%"> <img src="../Bilder/2013/2013_Meran_09.jpg" alt="Ausfahrt nach Meran 2013" border="0" width="404" height="303"></a></td>
<td align="center" width="50%"> <img src="../Bilder/2013/2013_Meran_10.jpg" alt="Ausfahrt nach Meran 2013" border="0" width="404" height="303"></a></td>
</tr>
<tr>
<td align="center" width="50%"> <img src="../Bilder/2013/2013_Meran_11.jpg" alt="Ausfahrt nach Meran 2013" border="0" width="404" height="303"></a></td>
<td align="center" width="50%"> <img src="../Bilder/2013/2013_Meran_12.jpg" alt="Ausfahrt nach Meran 2013" border="0" width="404" height="303"></a></td>
</tr>
<tr>
<td align="center" width="50%"> <img src="../Bilder/2013/2013_Meran_13.jpg" alt="Ausfahrt nach Meran 2013" border="0" width="404" height="303"></a></td>
<td align="center" width="50%"> <img src="../Bilder/2013/2013_Meran_14.jpg" alt="Ausfahrt nach Meran 2013" border="0" width="404" height="303"></a></td>
</tr>
<tr>
<td align="center" width="50%"> <img src="../Bilder/2013/2013_Meran_15.jpg" alt="Ausfahrt nach Meran 2013" border="0" width="455" height="303"></a></td>
<td align="center" width="50%"> <img src="../Bilder/2013/2013_Meran_16.jpg" alt="Ausfahrt nach Meran 2013" border="0" width="455" height="303"></a></td>
</tr>
<tr>
<td align="center" width="50%"> <img src="../Bilder/2013/2013_Meran_17.jpg" alt="Ausfahrt nach Meran 2013" border="0" width="455" height="303"></a></td>
<td align="center" width="50%"> <img src="../Bilder/2013/2013_Meran_18.jpg" alt="Ausfahrt nach Meran 2013" border="0" width="455" height="303"></a></td>
</tr>
<tr>
<td align="center" width="50%"> <img src="../Bilder/2013/2013_Meran_19.jpg" alt="Ausfahrt nach Meran 2013" border="0" width="404" height="303"></a></td>
<td align="center" width="50%"> <img src="../Bilder/2013/2013_Meran_20.jpg" alt="Ausfahrt nach Meran 2013" border="0" width="404" height="303"></a></td>
</tr>
<tr>
<td align="center" width="50%"> <img src="../Bilder/2013/2013_Meran_21.jpg" alt="Ausfahrt nach Meran 2013" border="0" width="404" height="303"></a></td>
<td align="center" width="50%"> <img src="../Bilder/2013/2013_Meran_22.jpg" alt="Ausfahrt nach Meran 2013" border="0" width="404" height="303"></a></td>
</tr>
<tr>
<td align="center" width="50%"> <img src="../Bilder/2013/2013_Meran_23.jpg" alt="Ausfahrt nach Meran 2013" border="0" width="404" height="303"></a></td>
<td align="center" width="50%"> <img src="../Bilder/2013/2013_Meran_24.jpg" alt="Ausfahrt nach Meran 2013" border="0" width="404" height="303"></a></td>
</tr>
<tr>
<td align="center" width="50%"> <img src="../Bilder/2013/2013_Meran_25.jpg" alt="Ausfahrt nach Meran 2013" border="0" width="404" height="303"></a></td>
<td align="center" width="50%"> <img src="../Bilder/2013/2013_Meran_26.jpg" alt="Ausfahrt nach Meran 2013" border="0" width="404" height="303"></a></td>
</tr>
<tr>
<td align="center" width="50%"> <img src="../Bilder/2013/2013_Meran_27.jpg" alt="Ausfahrt nach Meran 2013" border="0" width="404" height="303"></a></td>
<td align="center" width="50%"> <img src="../Bilder/2013/2013_Meran_28.jpg" alt="Ausfahrt nach Meran 2013" border="0" width="404" height="303"></a></td>
</tr>
<tr>
<td align="center" width="50%"> <img src="../Bilder/2013/2013_Meran_29.jpg" alt="Ausfahrt nach Meran 2013" border="0" width="404" height="303"></a></td>
<td align="center" width="50%"> <img src="../Bilder/2013/2013_Meran_30.jpg" alt="Ausfahrt nach Meran 2013" border="0" width="404" height="303"></a></td>
</tr>
<tr>
<td align="center" width="50%"> <img src="../Bilder/2013/2013_Meran_31.jpg" alt="Ausfahrt nach Meran 2013" border="0" width="404" height="303"></a></td>
<td align="center" width="50%"> <img src="../Bilder/2013/2013_Meran_32.jpg" alt="Ausfahrt nach Meran 2013" border="0" width="202" height="303"></a></td>
</tr>
<tr>
<td colspan="2" align="center" width="100%" > <font color="#EE453B"> <b><u>Motorradtreffen Arnach 2013 </u></b></font></td>
</tr>
<tr>
<td align="center" width="50%"> <img src="../Bilder/2013/2013_Arnach_01.jpg" alt="Arnach 2013" border="0" width="404" height="303"></a></td>
<td align="center" width="50%"> <img src="../Bilder/2013/2013_Arnach_02.jpg" alt="Arnach 2013" border="0" width="404" height="303"></a></td>
</tr>
<tr>
<td align="center" width="50%"> <img src="../Bilder/2013/2013_Arnach_03.jpg" alt="Arnach 2013" border="0" width="404" height="303"></a></td>
<td align="center" width="50%"> <img src="" alt="" border="0" width="455" height="303"></a></td>
</tr>
<tr>
<td colspan="2" align="center" width="100%" > <font color="#EE453B"> <b><u> Motorradteffen Wilsingen 2013 </u></b></font></td>
</tr>
<tr>
<td align="center" width="50%"> <img src="../Bilder/2013/2013_Wilsingen_01.jpg" alt="Wilsingen 2013" border="0" width="404" height="303"></a></td>
<td align="center" width="50%"> <img src="../Bilder/2013/2013_Wilsingen_02.jpg" alt="Wilsingen 2013" border="0" width="404" height="303"></a></td>
</tr>
<tr>
<td align="center" width="50%"> <img src="../Bilder/2013/2013_Wilsingen_03.jpg" alt="Wilsingen 2013" border="0" width="404" height="303"></a></td>
<td align="center" width="50%"> <img src="../Bilder/2013/2013_Wilsingen_04.jpg" alt="Wilsingen 2013" border="0" width="227" height="303"></a></td>
</tr>
<tr>
<td align="center" width="50%"> <img src="../Bilder/2013/2013_Wilsingen_05.jpg" alt="Wilsingen 2013" border="0" width="404" height="303"></a></td>
<td align="center" width="50%"> <img src="../Bilder/2013/2013_Wilsingen_06.jpg" alt="Wilsingen 2013" border="0" width="404" height="303"></a></td>
</tr>
<tr>
<td colspan="2" align="center" width="100%" > <font color="#EE453B"> <b><u> <a href="Entschleunigungstour.html"> Entschleunigungstour im Odenwald 2013 </a> </u></b></font></td>
</tr>
<td colspan="2" align="center" width="100%" > <font color="#EE453B"> <b><u> Sommergrillfest 2013 </u></b></font></td>
</tr>
<tr>
<td align="center" width="50%"> <img src="../Bilder/2013/2013_MFB Grillfest_01.jpg" alt="Grillfest 2013" border="0" width="455" height="303"></a></td>
<td align="center" width="50%"> <img src="../Bilder/2013/2013_MFB Grillfest_02.jpg" alt="Grillfest 2013" border="0" width="455" height="303"></a></td>
</tr>
<tr>
<td align="center" width="50%"> <img src="../Bilder/2013/2013_MFB Grillfest_03.jpg" alt="Grillfest 2013" border="0" width="202" height="303"></a></td>
<td align="center" width="50%"> <img src="../Bilder/2013/2013_MFB Grillfest_04.jpg" alt="Grillfest 2013" border="0" width="455" height="303"></a></td>
</tr>
<tr>
<td align="center" width="50%"> <img src="../Bilder/2013/2013_MFB Grillfest_05.jpg" alt="Grillfest 2013" border="0" width="455" height="303"></a></td>
<td align="center" width="50%"> <img src="../Bilder/2013/2013_MFB Grillfest_06.jpg" alt="Grillfest 2013" border="0" width="455" height="303"></a></td>
</tr>
<tr>
<td align="center" width="50%"> <img src="../Bilder/2013/2013_MFB Grillfest_08.jpg" alt="Grillfest 2013" border="0" width="455" height="303"></a></td>
<td align="center" width="50%"> <img src="../Bilder/2013/2013_MFB Grillfest_09.jpg" alt="Grillfest 2013" border="0" width="455" height="303"></a></td>
</tr>
<tr>
<td align="center" width="50%"> <img src="../Bilder/2013/2013_MFB Grillfest_10.jpg" alt="Grillfest 2013" border="0" width="455" height="303"></a></td>
<td align="center" width="50%"> <img src="../Bilder/2013/2013_MFB Grillfest_11.jpg" alt="Grillfest 2013" border="0" width="202" height="303"></a></td>
</tr>
</table>
</font>
</body>
</html>