• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

Problem mit Lightbox 2

Status
Für weitere Antworten geschlossen.
U

UltraViolator

Neues Mitglied
Hallo, ich bin neu hier und habe folgendes Problem.

Ich habe offline eine html Präsentation erstellt und habe für Produktfotos das JS Lightbox 2 verwendet. Jetzt habe ich das Problem das ich das Script in verschiedenen Ordnerebenen nutzen möchte. Funktioniert soweit alles ganz gut, bis auf das laden des loading.gif und next.gif. Ich die links in der lightbox.js entweder auf die eine oder auf die andere Ordnerebene ausrichten.
Daher meine Frage: Gibts es eine Möglichkeit die links auf die .gifs ohne die ../../ notation bspw. auf den obersten Ordner zu lenken und mich dann von dort aus herunter zu hangeln?


Ps:

ordner1/index.html
ordner1/ordner2/index.html

Ich möchte also bspw. für diese beiden index.html die lightbox nutzen.
Die Notation über den Laufwerksbuchstaben wird wohl auch nicht funktionieren, da die Präsentation von CD oder USB Stick auf verschiedenen Rechnern gestartet werden soll.

Vielen Dank schon einmal für eure Hilfe.
 
Das wäre rein theoretisch mit Javascript möglich. Aber ehrlich gesagt ist es einfacher sich 2 CSS-Dateien zu erstellen. Eins mit z.B. ../images/ und eins mit ../../images
Wenn du natürlich noch mehr Ordner-Tiefen hast, wird es problematisch.
Da das ganze ja lokal laufen soll und ohne Webserver ist PHP auch ausgeschlossen. Somit würde ich sagen einfach je nach Ordner-Tiefe eine andere CSS einbinden, bei denen die Bilder-URL abgeändert ist. Aber es muss doch auch ein problem geben beim einfügen der Javascript-Datei, da man je nach Ordner-Tiefe ja auch den Pfad anpassen muss.

Fazit:
2 CSS-Dateien erstellen um je nach Ordner-Tiefe trotzdem die richtige URL zu den Bildern hat.
 
Danke schonmal für die Hilfe, aber wie du leider schon richtig erkannt hast war das mit den 2 Ebenen nur ein Beispiel. Es werden denke ich insgesamt an die 10 werden.
Was meinst du mit dem einbinden der JS Datei? Dass ich in jeder Ebene den <Head> part der index.html verändern muss? Das habe ich bisher so gelöst. Gab soweit auch noch keine Probleme.
Die Lösung mit den CSS files verstehe ich leider aber auch nicht ganz. Die links zu den .gif dateien ist doch in der lightbox.js hinterlegt und nicht in der lightbox.css.
 
Komisch hab auf der Seite folgendes gelesen
  1. Check the CSS and make sure the referenced prev.gif and next.gif files are in the right location. Also, make sure the loading.gif and close.gif files as referenced near the top of the lightbox.js file are in the right location.
Zum Vergrößern anklicken....

Aber du du schon sagtest, dass es mehrere Ebenen gibt, muss es da ja auch ein workarround geben. Du könntest natürlich in jede Ebene 4 images rein kopieren (was natürlich sehr redundant wäre). Aber da für die lightbox eh JS aktiviert sein muss, kannst du den url string anhand des delimiters "/" splitten. Mit Hilfe der Anzahl der "/" kannst du dann den pfad für die Bilder ermitteln. Dafür müsstest du die CSS Bilder URL jedoch direkt in die html datei scheiben, da du das CSS sonst nicht verändenr kannst. Aber das ganze wird wohl sehr unsauber sein.

Was besseres fällt mir garde jedoch nicht ein.
 
Sorry, mein Fehler. Es geht um die loading.gif und die close.gif. Die anderen beiden (prev.gif und next.gif) benötige ich nicht, da ich sowieso immer nur ein einzelnes Bild in der Großansicht zeigen möchte.
 
Die Bilder-Pfade stehen im LightboxOptions-Objekt. Man müsste die pfade also über ein Script verändern können. Sollte dem so sein sollte meine "/"-Zähl-methode funktioeren.

Ich teste gleich mal aus, ob man das leicht ansteuern kann. (Unter der bedingung keiner meldet sich mit einem besseren Vorschlag :D)
 
Zuletzt bearbeitet:
Hm, das sieht wirklich recht unsauber aus denke ich.
Vllt. versuche ich es dann doch mit mehreren js dateien. Für jede Ebene eine.
Eine Möglichkeit über den kompletten Pfad zu gehen, also beginnend beim Laufwerksbuchstaben, jedoch mit dem aktuellen Laufwerk anstelle einer festen Angabe gibt es nicht oder?
 
War eine kleine Herausforderung. :D
Von mir getestet und als gut empfunden :P
Code: 
<script type="text/javascript">
      function setLightBoxImages(dirname) {
        // URL auslesen
        var url =  document.URL; 
          
        // nach Ordner suchen und URL ab da abschneiden   
        var pos = url.search(dirname);
        var newString = url.slice(pos, url.length);
        // Nun feststellen wie viele Ordner das zurück ist
        var array = newString.split("/");
        url = "";
        
        // String so erstellen, sodass in der ordner Struktur zurück gegangen wird
        for(var i=2; i < array.length; i++) {
          url += "../";
        }
        // Bilder Source ändern
        window.LightboxOptions.fileBottomNavCloseImage = url+window.LightboxOptions.fileBottomNavCloseImage;
        window.LightboxOptions.fileLoadingImage = url+window.LightboxOptions.fileLoadingImage;
       }
      
      // So wird das Ganze eingesetzt
      setLightBoxImages("localhost");  
      
    </script>
Wenn du fragen ast einfach stellen
Eventuell schon mal was vorweg:
der Order-name beschreibt die Ebene auf der du die CSS File bzw Javascript-File normal aufrufen könntest ohne Veränderungen vorzunehmen.

nehmen wir an du hast das ganze auf CD und deine erste index Datei die du startest ist unter /schulung/index.html
Dann ist der ordner natürlich schulung :)
 
Zuletzt bearbeitet:
"Double Post Action"
Wenn das Script nicht klappen sollte, oder es garnicht in frage kommt sag mal bescheid :D
 
Sorry, ich bin grad noch dabei es einzubinden. Bin mit JavaScript nicht so fit ;)

Also, ich hab es leider noch nicht hin bekommen. ich habe jetzt deinen code in eine separate .js datei gepackt und diese in meinen header mit eingebunden. Aber wie und wo kann ich deine Funktion jetzt ausführen lassen.
Und muss ich in dem lightbox.js auch etwas ändern?

Ich hoffe ich nerv dich nicht mit den Fragen, aber um ehrlich zu sein ist das mein erstes JavaScript an dem ich etwas rumbastle.
 
Zuletzt bearbeitet:
UltraViolator schrieb:
Sorry, ich bin grad noch dabei es einzubinden. Bin mit JavaScript nicht so fit ;)
Zum Vergrößern anklicken....
Direkt unter denen hier einfügen :)
Code: 
<script type="text/javascript" src="js/prototype.js"></script>
<script type="text/javascript" src="js/scriptaculous.js?load=effects,builder"></script>
<script type="text/javascript" src="js/lightbox.js"></script>
 
Also wenn ich nur das script oben anhänge funktioniert es leider nicht :-(
Es wird immernoch nur die eine Ebene mit den gifs versorgt die in der lightbox.js hinterlegt ist. Muss ich vllt. hier auch noch etwas ändern?
 
Das Script muss nach dem inkludieren der Lightbox kommen. Also erst die 3 JS Dateien einfügen und dann das Script folgen lassen. Und du musst noch die zeile ändern in der es aufgerufen wird
Also diese hier
Code: 
setLightBoxImages("localhost");

anstatt localhost muss da der die ordner Ebene rein in der das Script richtig funktoniert.
Nehmen wir an du hast das ganze im ordner "schulung"
hast jetzt noch den unterordner schulung2. Das ganze Funktionietr nicht auf der schulung2 Ebene sondern nur bei schulung.
Dann gibst du anstatt "localhost", "schulung" ein.

Zum beispiel:
"schulung"
 
Ok, das hatte ich noch nicht gemacht.
Also angenommen ich habe eine Datei "c:/praesentation/ordner1/ordner2/index.html" Für die das Skript aktuell funktioniert. Was muss ich dann anstatt "localhost" angeben? "ordner2"? Was ist dann wenn es diese Ordnerbeziechnung öfters gibt?
 
Du hast ja einmal das Script selbst. Nehmen wir an es liegt unter praesentation/javascript/
und du bindest es so ein, dass es unter praesentation/index.html funktioniert.
Dann gibts du auf allen unterseiten praesentation an. Er sucht das erste wort das praesentation heisst und rechnet dann die Ordner bis dahin zurück. Heisst, du musst nur noch eine lightbox.js haben und es nicht auf meherer Ordner verteilen
 
Hi!

Vielen Dank erstmal für die Mühe die du dir gemacht hast.
Ich habe jetzt alles nochmal nach deiner Anleitung umgesetzt. leider aber noch ohne Erfolg :(
Ich denke aber ich weiß woran es liegt, und warscheinlich war es wieder mein Fehler und ich habe das Problem zu ungenau geschildert ;ugl
Mit deiner Methode würde es wohl funktionieren wenn die Ordner alle in einer linearen Struktur sind.
Bei mir ist es aber der Fall dass ich eine mittlerweile recht komplexe Baumstruktur habe.
Man müsste sich also nicht nur Ordner nach oben, sondern evtl. auch wieder nach unten hangeln.
Eine Möglichkeit wäre es vllt. das Lightbox script auch in der obersten Ebene zu inkludieren, was ich bisher noch nicht brauchte. Werde es aber später nochmals testen.

Aber wie gesagt, vielen Dank schonmal für die schnelle und ausführliche Hilfe.
 
Du musst ja nur die Bilder-Pfade in der lightbox.js so setzen als würdest du sie in der obersten Ebene benutzen :)
Benutzen musst du sie dort ja nicht unbedingt. Aber dann würde mein Script funktionieren.
 
Status
Für weitere Antworten geschlossen.

Neueste Beiträge

Zurück
Oben