Tutorial für Lightbox v2.04 in die eigene Homepage
Erstellt von LuNe am Freitag 21. März 2008
Einfügen der Lightbox v2.04 in die eigene Homepage
(heute aktuallisiert auf die Version 2.04)
1. Download der Lightbox v2.04 von dieser Webseite: lightbox2
2. Entpacken der zip-Datei auf die Festplatte
3. Erstelle wie gewohnt eine Webseite mit einem Editor deiner Wahl
4. kopiere jetzt diesen Teil
und füge ihn im Editor zwischen <head> und </head> ein
5. wir fügen jetzt den Code für das/die Bild/er zwischen <body> und </body> ein
füge nachfolgenden Code an die Stelle wo das Bild erscheinen soll ein
Die Pfade zu den Bildern müssen natürlich angepaßt werden wo deine Bilder sind. ( In meinem Beispiel hier ist es der Ordner lightbox-tutorial)
Ergänzung:
Wenn du mehrere Bilder anzeigen lassen möchtest, dann muss noch zusätzlich roadtrip eingefügt werden und sieht dann so aus bei 3 Bildern:
Wenn man nun mit der Maus im Bild oben links bzw. oben rechts drüberfährt wird "prev" bzw. "next" eingeblendet.
Speichere die erstellte Webseite nun in den Ordner wo du vorhin die lightbox entpackt hast.
6. kopiere nun den gesamten Ordner mit der gerade erstellten Webseite und den darin befindlichen Ordnern css, images und js auf deinen Server/Webspace.
W I C H T I G:
Es müssen von jedem Bild 2 Stück vorhanden sein. Ein Bild in der Originalgröße und das gleiche Bild nochmal verkleinert. Das Verkleinerte hat in diesem Beispiel den Zusatz im Dateinamen thumb. Damit können wird die Bilder gut unterscheiden.
Bitte beachte: speichere immer alle Dateiennamen, also auch die Bilder, mit kleinen Buchstaben und ohne Umlaute (ö, ü, ä) und ohne Leerzeichen
7. Öffne nun mit einem Browser deiner Wahl die erstellte Webseite.
Meine Beispielseite findest du hier: Beispielseite mit Lightbox
Tags: Tipps, Webmaster, Anleitung, Einfügen in Webseite, Lightbox, Tutorial
The Tutorial für Lightbox v2.04 in die eigene Homepage by Blog von Lutz Nelde, unless otherwise expressly stated, is licensed under a Creative Commons Attribution-Noncommercial-No Derivative Works 3.0 Germany License.
kein Kommentar.
Montag 14. Januar 2008 um 00:05
Wer hiermit nicht klar kommt kann ja auch mal bei Daniel schauen http://www.homepage-faqs.de/index.php?site=js-lightbox-effekt-fuer-bildergalerie.
Ein Besuch dieser FAQ lohnt sich dort immer, insbesondere für Webmaster
Diesen Beitrag zitieren
Twitter: LuNeX
Like or Dislike:
0 
0
Dienstag 21. Oktober 2008 um 18:01
Hallo,
vielen dank ersteinmal für die wunderbare Anleitung der Lightboxs. Ich hatte direkt ausprobiert und Sie in der Website eingebaut.
Es funktionierte auch. Nur hierbei gab es ein Problem. Mein Sidemenu (menu-collapsed und jquery-1-Javascript) kommen sich in die quere.
Wenn ich die Javascripte für die Lightbox unterhalb der Javascripte für das Sidemenu stelle funktioniert es, dafür aber nicht mehr das Sidemenu.
Leider konnte mir keiner bei dem Problem helfen. Schade, muß die Lightbox wieder entfernen und mich mit dem Sidemenueffekt-Aufklappmenü (
)zufrieden geben.
Es scheint wohl zu sein: Das die Reihenfolge der Javascripte nicht miteinander kompatible sind.
Noch einmal vielen Dank für die sehr gute Erklärung.
Gruß
Elke
Diesen Beitrag zitieren
Like or Dislike:
0 
0