Versions-Historie des Beitrags „Lightbox 2“

Lightbox 2

bearbeitet von Windassel 14.05.2013 19:06

> مرحبا > > > <a href="Bilder/4.jpg-groß.JPG"> > > <img src="Bilder/4.jpg-klein.JPG" > > > ist es richtig, dass ich bei a href genau den gleichen link angebe wie bei img src? > > Inwiefern sind beide gleich? > > mfg Das Problem hat sich schon gelöst. Ich hatte es mir eigentlich so gedacht, dass das Bild bei img src kleiner ist als das bei a href. Also das bei a href ist etwas größe, sodass man, wenn man dann auf das Bild drauf klickt, es auch größer erscheint. Hab jetzt einfach nur die Größe verändert. Wie kann ich denn jetzt diese ganzen Bilder auf meine Seite einbinden? Funktioniert irgendwie nicht... So sieht die ganze lightbox aus. Nur ich möchte die gerne in meinen content auf meiner homepage einbauen. ~~~ html <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <title>Klassenfahrt</title> <meta name="author" content="Marius M"> <meta name="editor" content="html-editor phase 5"> <script src="js/jquery-1.7.2.min.js"></script> <script src="js/lightbox.js"></script> <link href="css/lightbox.css" rel="stylesheet" /> </head> <body>  <a href="Bilder/4.jpg.JPG" rel="lightbox[Obernberg]"> <img src="Bilder/4.jpg.JPG" alt="" border="0" width="500" height="300"> </a> <a href="Bilder/5.jpg.JPG" rel="lightbox[Obernberg]"> <img src="Bilder/5.jpg.JPG" alt="" border="0" width="500" height="300"> </a> <a href="Bilder/6.jpg.JPG" rel="lightbox[Obernberg]"> <img src="Bilder/6.jpg.JPG" alt="" border="0" width="500" height="300"> </a> <a href="Bilder/4.jpg.JPG" rel="lightbox[Obernberg]"> <img src="Bilder/bild2.jpg.JPG" alt="" border="0" width="500" height="300"> </a> <a href="Bilder/Header.jpg.JPG" rel="lightbox[Obernberg]"> <img src="Bilder/Header.jpg.JPG" alt="" border="0" width="500" height="300"> </a> <a href="Bilder/header3.jpg.JPG" rel="lightbox[Obernberg]"> <img src="Bilder/header3.jpg.JPG" alt="" border="0" width="500" height="300"> </a> <a href="Bilder/P1.jpg.JPG" rel="lightbox[Obernberg]"> <img src="Bilder/P1.jpg.JPG" alt="" border="0" width="500" height="300"> </a> <a href="Bilder/P10.JPG" rel="lightbox[Obernberg]"> <img src="Bilder/P10.JPG" alt="" border="0" width="500" height="300"> </a> <a href="Bilder/P12.JPG" rel="lightbox[Obernberg]"> <img src="Bilder/P12.JPG" alt="" border="0" width="500" height="300"> </a> <a href="Bilder/P11.JPG" rel="lightbox[Obernberg]"> <img src="Bilder/P11.JPG" alt="" border="0" width="500" height="300"> </a> <a href="Bilder/P13.JPG" rel="lightbox[Obernberg]"> <img src="Bilder/P13.JPG" alt="" border="0" width="500" height="300"> </a> <a href="Bilder/P2.JPG" rel="lightbox[Obernberg]"> <img src="Bilder/P2.JPG" alt="" border="0" width="500" height="300"> </a> <a href="Bilder/P3.JPG" rel="lightbox[Obernberg]"> <img src="Bilder/P3.JPG" alt="" border="0" width="500" height="300"> </a> <a href="Bilder/P5.JPG" rel="lightbox[Obernberg]"> <img src="Bilder/P5.JPG" alt="" border="0" width="500" height="300"> </a> <a href="Bilder/P6.JPG" rel="lightbox[Obernberg]"> <img src="Bilder/P6.JPG" alt="" border="0" width="500" height="300"> </a> <a href="Bilder/P7.JPG" rel="lightbox[Obernberg]"> <img src="Bilder/P7.JPG" alt="" border="0" width="500" height="300"> </a> <a href="Bilder/P8.JPG" rel="lightbox[Obernberg]"> <img src="Bilder/P8.JPG" alt="" border="0" width="500" height="300"> </a> <a href="Bilder/P9.JPG" rel="lightbox[Obernberg]"> <img src="Bilder/P9.JPG" alt="" border="0" width="500" height="300"> </a> </body> </html> ~~~ Und meiner Seite inkl. der lightbox sieht dann so aus: ~~~ html <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <title>Klassenfahrt</title> <meta name="author" content="Marius M"> <meta name="editor" content="html-editor phase 5"> <link href="stylesheet.css" type="text/css" rel="stylesheet" /> <script src="js/jquery-1.7.2.min.js"></script> <script src="js/lightbox.js"></script> <link href="css/lightbox.css" rel="stylesheet" /> </head> <body>  <div align="center"> <div id="root_site">  <ul id="navigation_main_container">  <li><a href="Indecks.html">Home</a></li> <li><a href="Tag1.html">Tag 1</a></li> <li><a href="Tag2.html">Tag 2</a></li> <li><a href="Tag3.html">Tag 3</a></li> <li><a href="Tag4.html">Tag 4</a></li> <li><a href="Tag5.html">Tag 5</a></li> <li><a href="Bilder.html">Bilder&nbsp</a></li> </ul>  <div id="content_main_container">  <div id="content_table_main_container"> <a href="Bilder/4.jpg.JPG" rel="lightbox[Obernberg]"> <img src="Bilder/4.jpg.JPG" alt="" border="0" width="500" height="300"> </a> <a href="Bilder/5.jpg.JPG" rel="lightbox[Obernberg]"> <img src="Bilder/5.jpg.JPG" alt="" border="0" width="500" height="300"> </a> <a href="Bilder/6.jpg.JPG" rel="lightbox[Obernberg]"> <img src="Bilder/6.jpg.JPG" alt="" border="0" width="500" height="300"> </a> <a href="Bilder/4.jpg.JPG" rel="lightbox[Obernberg]"> <img src="Bilder/bild2.jpg.JPG" alt="" border="0" width="500" height="300"> </a> <a href="Bilder/Header.jpg.JPG" rel="lightbox[Obernberg]"> <img src="Bilder/Header.jpg.JPG" alt="" border="0" width="500" height="300"> </a> <a href="Bilder/header3.jpg.JPG" rel="lightbox[Obernberg]"> <img src="Bilder/header3.jpg.JPG" alt="" border="0" width="500" height="300"> </a> <a href="Bilder/P1.jpg.JPG" rel="lightbox[Obernberg]"> <img src="Bilder/P1.jpg.JPG" alt="" border="0" width="500" height="300"> </a> <a href="Bilder/P10.JPG" rel="lightbox[Obernberg]"> <img src="Bilder/P10.JPG" alt="" border="0" width="500" height="300"> </a> <a href="Bilder/P12.JPG" rel="lightbox[Obernberg]"> <img src="Bilder/P12.JPG" alt="" border="0" width="500" height="300"> </a> <a href="Bilder/P11.JPG" rel="lightbox[Obernberg]"> <img src="Bilder/P11.JPG" alt="" border="0" width="500" height="300"> </a> <a href="Bilder/P13.JPG" rel="lightbox[Obernberg]"> <img src="Bilder/P13.JPG" alt="" border="0" width="500" height="300"> </a> <a href="Bilder/P2.JPG" rel="lightbox[Obernberg]"> <img src="Bilder/P2.JPG" alt="" border="0" width="500" height="300"> </a> <a href="Bilder/P3.JPG" rel="lightbox[Obernberg]"> <img src="Bilder/P3.JPG" alt="" border="0" width="500" height="300"> </a> <a href="Bilder/P5.JPG" rel="lightbox[Obernberg]"> <img src="Bilder/P5.JPG" alt="" border="0" width="500" height="300"> </a> <a href="Bilder/P6.JPG" rel="lightbox[Obernberg]"> <img src="Bilder/P6.JPG" alt="" border="0" width="500" height="300"> </a> <a href="Bilder/P7.JPG" rel="lightbox[Obernberg]"> <img src="Bilder/P7.JPG" alt="" border="0" width="500" height="300"> </a> <a href="Bilder/P8.JPG" rel="lightbox[Obernberg]"> <img src="Bilder/P8.JPG" alt="" border="0" width="500" height="300"> </a> <a href="Bilder/P9.JPG" rel="lightbox[Obernberg]"> <img src="Bilder/P9.JPG" alt="" border="0" width="500" height="300"> </a> </div> </div>  <div id="footer_main_container">  Content Copyright© 2013 by Marius M and Maik Mikus. <a style="text-decoration: none;" href="Impressum.html"><font color="#FFFFFF">Impressum</font></a> </div>  </div> </div> </body>  </html> ~~~ Hat wer eine Idee? :/

Lightbox 2

bearbeitet von

Matthias Scharwies 20.04.2022 13:36

> مرحبا > > > <a href="Bilder/4.jpg-groß.JPG"> > > <img src="Bilder/4.jpg-klein.JPG" > > > ist es richtig, dass ich bei a href genau den gleichen link angebe wie bei img src? > > Inwiefern sind beide gleich? > > mfg Das Problem hat sich schon gelöst. Ich hatte es mir eigentlich so gedacht, dass das Bild bei img src kleiner ist als das bei a href. Also das bei a href ist etwas größe, sodass man, wenn man dann auf das Bild drauf klickt, es auch größer erscheint. Hab jetzt einfach nur die Größe verändert. Wie kann ich denn jetzt diese ganzen Bilder auf meine Seite einbinden? Funktioniert irgendwie nicht... So sieht die ganze lightbox aus. Nur ich möchte die gerne in meinen content auf meiner homepage einbauen. ~~~ html <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <title>Klassenfahrt</title> <meta name="author" content="Marius Mehrmann"> <meta name="editor" content="html-editor phase 5"> <script src="js/jquery-1.7.2.min.js"></script> <script src="js/lightbox.js"></script> <link href="css/lightbox.css" rel="stylesheet" /> </head> <body>  <a href="Bilder/4.jpg.JPG" rel="lightbox[Obernberg]"> <img src="Bilder/4.jpg.JPG" alt="" border="0" width="500" height="300"> </a> <a href="Bilder/5.jpg.JPG" rel="lightbox[Obernberg]"> <img src="Bilder/5.jpg.JPG" alt="" border="0" width="500" height="300"> </a> <a href="Bilder/6.jpg.JPG" rel="lightbox[Obernberg]"> <img src="Bilder/6.jpg.JPG" alt="" border="0" width="500" height="300"> </a> <a href="Bilder/4.jpg.JPG" rel="lightbox[Obernberg]"> <img src="Bilder/bild2.jpg.JPG" alt="" border="0" width="500" height="300"> </a> <a href="Bilder/Header.jpg.JPG" rel="lightbox[Obernberg]"> <img src="Bilder/Header.jpg.JPG" alt="" border="0" width="500" height="300"> </a> <a href="Bilder/header3.jpg.JPG" rel="lightbox[Obernberg]"> <img src="Bilder/header3.jpg.JPG" alt="" border="0" width="500" height="300"> </a> <a href="Bilder/P1.jpg.JPG" rel="lightbox[Obernberg]"> <img src="Bilder/P1.jpg.JPG" alt="" border="0" width="500" height="300"> </a> <a href="Bilder/P10.JPG" rel="lightbox[Obernberg]"> <img src="Bilder/P10.JPG" alt="" border="0" width="500" height="300"> </a> <a href="Bilder/P12.JPG" rel="lightbox[Obernberg]"> <img src="Bilder/P12.JPG" alt="" border="0" width="500" height="300"> </a> <a href="Bilder/P11.JPG" rel="lightbox[Obernberg]"> <img src="Bilder/P11.JPG" alt="" border="0" width="500" height="300"> </a> <a href="Bilder/P13.JPG" rel="lightbox[Obernberg]"> <img src="Bilder/P13.JPG" alt="" border="0" width="500" height="300"> </a> <a href="Bilder/P2.JPG" rel="lightbox[Obernberg]"> <img src="Bilder/P2.JPG" alt="" border="0" width="500" height="300"> </a> <a href="Bilder/P3.JPG" rel="lightbox[Obernberg]"> <img src="Bilder/P3.JPG" alt="" border="0" width="500" height="300"> </a> <a href="Bilder/P5.JPG" rel="lightbox[Obernberg]"> <img src="Bilder/P5.JPG" alt="" border="0" width="500" height="300"> </a> <a href="Bilder/P6.JPG" rel="lightbox[Obernberg]"> <img src="Bilder/P6.JPG" alt="" border="0" width="500" height="300"> </a> <a href="Bilder/P7.JPG" rel="lightbox[Obernberg]"> <img src="Bilder/P7.JPG" alt="" border="0" width="500" height="300"> </a> <a href="Bilder/P8.JPG" rel="lightbox[Obernberg]"> <img src="Bilder/P8.JPG" alt="" border="0" width="500" height="300"> </a> <a href="Bilder/P9.JPG" rel="lightbox[Obernberg]"> <img src="Bilder/P9.JPG" alt="" border="0" width="500" height="300"> </a> </body> </html> ~~~ Und meiner Seite inkl. der lightbox sieht dann so aus: ~~~ html <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <title>Klassenfahrt</title> <meta name="author" content="Marius Mehrmann"> <meta name="editor" content="html-editor phase 5"> <link href="stylesheet.css" type="text/css" rel="stylesheet" /> <script src="js/jquery-1.7.2.min.js"></script> <script src="js/lightbox.js"></script> <link href="css/lightbox.css" rel="stylesheet" /> </head> <body>  <div align="center"> <div id="root_site">  <ul id="navigation_main_container">  <li><a href="Indecks.html">Home</a></li> <li><a href="Tag1.html">Tag 1</a></li> <li><a href="Tag2.html">Tag 2</a></li> <li><a href="Tag3.html">Tag 3</a></li> <li><a href="Tag4.html">Tag 4</a></li> <li><a href="Tag5.html">Tag 5</a></li> <li><a href="Bilder.html">Bilder&nbsp</a></li> </ul>  <div id="content_main_container">  <div id="content_table_main_container"> <a href="Bilder/4.jpg.JPG" rel="lightbox[Obernberg]"> <img src="Bilder/4.jpg.JPG" alt="" border="0" width="500" height="300"> </a> <a href="Bilder/5.jpg.JPG" rel="lightbox[Obernberg]"> <img src="Bilder/5.jpg.JPG" alt="" border="0" width="500" height="300"> </a> <a href="Bilder/6.jpg.JPG" rel="lightbox[Obernberg]"> <img src="Bilder/6.jpg.JPG" alt="" border="0" width="500" height="300"> </a> <a href="Bilder/4.jpg.JPG" rel="lightbox[Obernberg]"> <img src="Bilder/bild2.jpg.JPG" alt="" border="0" width="500" height="300"> </a> <a href="Bilder/Header.jpg.JPG" rel="lightbox[Obernberg]"> <img src="Bilder/Header.jpg.JPG" alt="" border="0" width="500" height="300"> </a> <a href="Bilder/header3.jpg.JPG" rel="lightbox[Obernberg]"> <img src="Bilder/header3.jpg.JPG" alt="" border="0" width="500" height="300"> </a> <a href="Bilder/P1.jpg.JPG" rel="lightbox[Obernberg]"> <img src="Bilder/P1.jpg.JPG" alt="" border="0" width="500" height="300"> </a> <a href="Bilder/P10.JPG" rel="lightbox[Obernberg]"> <img src="Bilder/P10.JPG" alt="" border="0" width="500" height="300"> </a> <a href="Bilder/P12.JPG" rel="lightbox[Obernberg]"> <img src="Bilder/P12.JPG" alt="" border="0" width="500" height="300"> </a> <a href="Bilder/P11.JPG" rel="lightbox[Obernberg]"> <img src="Bilder/P11.JPG" alt="" border="0" width="500" height="300"> </a> <a href="Bilder/P13.JPG" rel="lightbox[Obernberg]"> <img src="Bilder/P13.JPG" alt="" border="0" width="500" height="300"> </a> <a href="Bilder/P2.JPG" rel="lightbox[Obernberg]"> <img src="Bilder/P2.JPG" alt="" border="0" width="500" height="300"> </a> <a href="Bilder/P3.JPG" rel="lightbox[Obernberg]"> <img src="Bilder/P3.JPG" alt="" border="0" width="500" height="300"> </a> <a href="Bilder/P5.JPG" rel="lightbox[Obernberg]"> <img src="Bilder/P5.JPG" alt="" border="0" width="500" height="300"> </a> <a href="Bilder/P6.JPG" rel="lightbox[Obernberg]"> <img src="Bilder/P6.JPG" alt="" border="0" width="500" height="300"> </a> <a href="Bilder/P7.JPG" rel="lightbox[Obernberg]"> <img src="Bilder/P7.JPG" alt="" border="0" width="500" height="300"> </a> <a href="Bilder/P8.JPG" rel="lightbox[Obernberg]"> <img src="Bilder/P8.JPG" alt="" border="0" width="500" height="300"> </a> <a href="Bilder/P9.JPG" rel="lightbox[Obernberg]"> <img src="Bilder/P9.JPG" alt="" border="0" width="500" height="300"> </a> </div> </div>  <div id="footer_main_container">  Content Copyright© 2013 by Marius Mehrmann and Maik Mikus. <a style="text-decoration: none;" href="Impressum.html"><font color="#FFFFFF">Impressum</font></a> </div>  </div> </div> </body>  </html> ~~~ Hat wer eine Idee? :/