1
Lightbox Album über weiteren Link öffnen
Tagchen
Ich habe auf meiner Webseite eine Bildergalerie mit Lightbox2 eingerichtet, funktioniert soweit auch alles bestens.
Nun möchte ich aber neben der Galerie noch eine Liste für die verschiedenen Alben (man kann Bilder bei Lightbox ja einem Album zuweisen), bei anklicken eines Links soll dann das entsprechende Album geöffnet werden.
Eine erste Variante habe ich natürlich, ich mache einen normalen a href mit lightbox-rel auf das erste Bild eines Albums. Dummerweise wird dann dieses Bild durch den Link nochmals zum Album hinzugefügt und dann kommt es zwei mal darin vor.
Könnt ihr mir sagen, wie ich durch den Link einfach das Album an sich öffnen kann ohne ein Bild nennen zu müssen?
Bisheriger Code:
Natürlich beinhaltet die Linkliste bei mir mehrere Alben, aber das reicht wohl als Beispiel.
Gruss Jinxy
Ich habe auf meiner Webseite eine Bildergalerie mit Lightbox2 eingerichtet, funktioniert soweit auch alles bestens.
Nun möchte ich aber neben der Galerie noch eine Liste für die verschiedenen Alben (man kann Bilder bei Lightbox ja einem Album zuweisen), bei anklicken eines Links soll dann das entsprechende Album geöffnet werden.
Eine erste Variante habe ich natürlich, ich mache einen normalen a href mit lightbox-rel auf das erste Bild eines Albums. Dummerweise wird dann dieses Bild durch den Link nochmals zum Album hinzugefügt und dann kommt es zwei mal darin vor.
Könnt ihr mir sagen, wie ich durch den Link einfach das Album an sich öffnen kann ohne ein Bild nennen zu müssen?
Bisheriger Code:
<div class="galery-list">
<ul>
<li><a href="pic1.jpg" rel="lightbox[float]" title="Sonstiges">Beispielbilder</a></li>
</ul>
</div>
<div id="content">
<div class="galery-float">
<a href="pic1.jpg" rel="lightbox[float]" title="1"><img src="pic1.jpg"></a>
<a href="pic2.jpg" rel="lightbox[float]" title="2"><img src="pic2.jpg"></a>
<a href="pic3.jpg" rel="lightbox[float]" title="3"><img src="pic3.jpg"></a>
<a href="pic4.jpg" rel="lightbox[float]" title="4"><img src="spic4.jpg"></a>
<a href="pic5.jpg" rel="lightbox[float]" title="5"><img src="pic5.jpg"></a>
</div>
</div>Natürlich beinhaltet die Linkliste bei mir mehrere Alben, aber das reicht wohl als Beispiel.
Gruss Jinxy
Share on Facebook
Share on Twitter
Share on Reddit
Share on LinkedinPlease also mark the comments that contributed to the solution of the article
Content-Key: 113601
Url: https://administrator.de/contentid/113601
Printed on: April 26, 2024 at 02:04 o'clock
1 Comment
Problem wiefolgt gelöst:
Habe mir nun Lytebox (v3.2) geholt. Da dieses neben der normalen Bildergalerie auch eine Slideshow beinhaltet, kann man die Funktionen auf der Seite gut kombinieren.
Habe also nun Links auf der Seite die verschiedenen Bilder aufgeteilt in Alben und rechts eine Liste der Alben als Slideshow, das kommt im grossen und ganzen sehr hübsch.
Die Slideshow "füttert" man neben dem direkt verlinkten Bild mit weiteren leeren Links auf die anderen Bilder, welche dem Slideshow-Album zugewiesen werden.
Gruss Jinxy
Habe mir nun Lytebox (v3.2) geholt. Da dieses neben der normalen Bildergalerie auch eine Slideshow beinhaltet, kann man die Funktionen auf der Seite gut kombinieren.
Habe also nun Links auf der Seite die verschiedenen Bilder aufgeteilt in Alben und rechts eine Liste der Alben als Slideshow, das kommt im grossen und ganzen sehr hübsch.
Die Slideshow "füttert" man neben dem direkt verlinkten Bild mit weiteren leeren Links auf die anderen Bilder, welche dem Slideshow-Album zugewiesen werden.
<div id="adds">
<div class="gallery-list">
<h1>Slideshow-Alben:</h1>
<ul>
<li><a href="imgs/header.jpg" rel="lyteshow[show]" title="Sonstiges">Beispielbilder</a></li>
<a href="imgs/waterfalls.jpg" rel="lyteshow[show]" title="waterfall"></a>
<a href="imgs/ganzia.jpg" rel="lyteshow[show]" title="flower"></a>
<a href="imgs/step1.jpg" rel="lyteshow[show]" title="trees"></a>
<li><a href="imgs/step1.jpg" rel="lyteshow[show2]" title="Sonstiges">Beispielbilder 2</a></li>
<a href="imgs/torc1.jpg" rel="lyteshow[show2]" title="torc"></a>
<a href="imgs/image-1.jpg" rel="lyteshow[show2]" title="leaves"></a>
</ul>
</div>
</div>
<div id="content">
<div class="gallery">
<div class="gallery-float-top">
<h1>Beispielbilder</h1>
<a href="imgs/header.jpg" rel="lytebox[float]" title="header"><img src="thumbs/header.jpg"></a>
<a href="imgs/waterfalls.jpg" rel="lytebox[float]" title="waterfall"><img src="thumbs/waterfalls.jpg"></a>
<a href="imgs/ganzia.jpg" rel="lytebox[float]" title="flower"><img src="thumbs/ganzia.jpg"></a>
<a href="imgs/step1.jpg" rel="lytebox[float]" title="trees"><img src="thumbs/step1.jpg"></a>
</div>
<div class="gallery-float">
<h1>Beispielbilder 2</h1>
<a href="imgs/step1.jpg" rel="lytebox[float2]" title="trees"><img src="thumbs/step1.jpg"></a>
<a href="imgs/torc1.jpg" rel="lytebox[float2]" title="torc"><img src="thumbs/torc1.jpg"></a>
<a href="imgs/image-1.jpg" rel="lytebox[float2]" title="leaves"><img src="thumbs/image-1.jpg"></a>
</div>
</div>Gruss Jinxy
