Lightbox - Variante 2
Das ist eine sehr einfache Variante der Lightbox. Damit können Bilder, Videos, Google Maps oder Inline-Elemente in einer Lightbox angezeigt werden
Hinweis
Diese Variante der Lightbox unterstützt keine Gallery-Funktion (Blätterfunktion)!
Diese Variante der Lightbox unterstützt keine Gallery-Funktion (Blätterfunktion)!
Einbindung
- Laden Sie den ZIP-Ordner "Lity Lightbox" herunter und entpacken Sie den Ordner.
- Kopieren Sie die Datei
lity.css
in den css-Ordner und die Dateility.js
in den js-Ordner. - Fügen Sie die richtigen Verknüpfungen zu den Dateien vor dem schliessenden
</head>
-Tag ein und passen Sie den Pfad an. - Die Inhalte für die Lightbox müssen im
<body>
-Bereich eingefügt werden. - Alle Elemente die mit der Lightbox geöffnet werden sollen benötigen das Attribut "data-lity".
HTML - Head
Hinweis
Die Verknüpfung zum JQuery-Framework (
Wenn in der HTML-Seite bereits das JQuery-Framework verwendet wird z. B. es wurde schon der Slider eingebaut oder bei der Verwendung von Bootstrap- oder HTML5UP-Templates,
braucht das JQuery-Framework nicht mehr eingebunden werden!
Bei HTML5UP-Templates wird die Verknüpfung zur JavaScript-Datei vor dem schliessenden
Die Verknüpfung zum JQuery-Framework (
<script src="https://code.jquery.com/jquery-latest.min.js"></script>
) darf nur einmal in der HTML-Seite vorkommen!Wenn in der HTML-Seite bereits das JQuery-Framework verwendet wird z. B. es wurde schon der Slider eingebaut oder bei der Verwendung von Bootstrap- oder HTML5UP-Templates,
braucht das JQuery-Framework nicht mehr eingebunden werden!
Bei HTML5UP-Templates wird die Verknüpfung zur JavaScript-Datei vor dem schliessenden
</body>
-Tag eingefügt.
HTML - Body
Lightbox - Elemente
Bild YouTube Video Vimeo Video Google Map
Download
Dieses Lightbox-Paket kann auch hier heruntergeladen werden:
Download Lity Lightbox