Bildervorschau als Slider für jede Fehrienwohnung

This commit is contained in:
Michael Stangl
2026-08-24 16:37:31 +02:00
parent d6822f826c
commit 6c4ed83ac5
3 changed files with 125 additions and 34 deletions
+17 -6
View File
@@ -11,12 +11,23 @@
</div>
{{ with .Params.bilder }}
<div class="galerie">
{{ range . }}
<a href="{{ . }}" class="galerie-link">
<img src="{{ . }}" alt="Foto" class="galerie-img" loading="lazy">
</a>
{{ end }}
<div class="slider slider--quad lightbox-gallery">
<button type="button" class="slider-arrow slider-prev" aria-label="Zurück">&#10094;</button>
<div class="slider-track">
{{ range $i, $img := . }}
<a href="{{ $img }}" target="_blank" rel="noopener" class="slider-slide lightbox-trigger">
<img src="{{ $img }}" alt="{{ $.Title }} – Foto {{ add $i 1 }}" loading="lazy">
</a>
{{ end }}
</div>
<button type="button" class="slider-arrow slider-next" aria-label="Weiter">&#10095;</button>
</div>
<div class="lightbox" hidden>
<button type="button" class="lightbox-close" aria-label="Schließen">&times;</button>
<button type="button" class="lightbox-arrow lightbox-prev" aria-label="Vorheriges Bild">&#10094;</button>
<img class="lightbox-img" src="" alt="">
<button type="button" class="lightbox-arrow lightbox-next" aria-label="Nächstes Bild">&#10095;</button>
</div>
{{ end }}