Two lightboxes with two thumbnails

Hi,
finally i got it to work to get to Lightboxes on the same page to work, there is only one thing i cant get to work.

i waant to display only one thumpnail for every lightbox, i gave the first image element the first class an than set it with css to display none.
that work fine if there is only one lightbox but when i have to the second one will not be displayed because there is no fist set.

here is my code, may someone can help me fix this:

<div class="bilderbox">

	<div class="topogal">
		<div class="detailitemheader">
			Topobilder: 
		</div>
		<div class="detailitem topoimg">
			<ul class="topogals">
				<div class="avia-gallery">
				[each topobilder]
					<li class="topo [once]first[/once] ">
						<a href="{@_src.full}" data-lightbox="T (Email address hidden if logged out) }" class="lbimg " title="Topobilder: {@bergname} - {@routenname}" rel="Topobilder">
							<img data-lightbox="Topobilder" src="{@_src}" class="lbimg [once]firstimg[/once]" />	
						</a>
					</li>
				[/each]
				</div>
			</ul>
		</div>
	</div>

	
	
	
	<div class="picgal">
		<div class="detailitemheader">
			Bildergalerie:  
		</div>
		
		<div id="galbox" class="detailitem galerie">
			<ul class="picgals">
				<div class="avia-gallery">
				[each bildergalerie]
					<li class="gal [once]first[/once]">
						<a href="{@_src.full}" data-lightbox="Tourenbilder  (Email address hidden if logged out) }" class="lbimg " title="Bildergalerie: {@bergname} - {@routenname}" rel="Tourenbilder">
							<img data-lightbox="Tourenbilder  (Email address hidden if logged out) }" src="{@_src}" class="lbimg [once]firstimg[/once]" />	
						</a>
					</li>
				[/each]
				</div>
			</ul>
		</div>
	</div>

	
</div>

css file:
.galerie ul li.first{
display:block;
}
.galerie ul li{
display:;
}
.topoimg ul li.first{
display:block;
}
.topoimg ul li {
display:none;
}

• This topic was modified 4 years, 8 months ago by traillight.