Problem mit Lightbox

M

Mogli-Designz

Mitglied
Hallo liebes Forum, ich brauche eure Hilfe:

In meiner Lightbox sollen 2 Bilder rein, zwischen denen man mit dem "NEXT" Button switchen kann.
Aber irgendwann hat ein anderer Programmierer dort mal was umgestellt, seitdem wird der NEXT-Button nicht mehr angezeigt. Man kann zwar mit den Rechts-Links Tasen an der Tastatur zwischen den Bildern springen, jedoch wissen das ja die User nicht...

Kann mir jemand erzählen wo er die Button "unsichtbar"/"ausgeschaltet" haben könnte?
Habe leider nicht so viel Plan von der ganzen Sache.

Gruß Mogli
 
Mogli-Designz hat gesagt.:
irgendwann hat ein anderer Programmierer dort mal was umgestellt, seitdem wird der NEXT-Button nicht mehr angezeigt.

Kann mir jemand erzählen wo er die Button "unsichtbar"/"ausgeschaltet" haben könnte?
Zum Vergrößern anklicken....
Wir reden von http://www.huddletogether.com/projects/lightbox2/?

Und der "Prev"-Button erscheint, wenn das nächste Bild der Galerie geladen wird?

Falls nicht, überprüf zunächst in der CSS-Datei "lightbox.css" die Pfade zu ihren Hintergrundbildern:
CSS: 
#prevLink:hover, #prevLink:visited:hover { background: url(../images/prevlabel.gif) left 15% no-repeat; }
#nextLink:hover, #nextLink:visited:hover { background: url(../images/nextlabel.gif) right 15% no-repeat; }

Falls doch, könnte der Button beispielsweise in diesem Deklarationsblock mit display:none versteckt worden sein:
CSS: 
#nextLink { right: 0; float: right;}

Alle Angaben ohne Gewähr, da von dir hier kein Code oder Link vorliegt :p
 
Danke dir, also ich finde keine deiner beschriebenen Fehler :)
Hier mal der CSS-Code:

Code: 
#lightbox{	position: absolute;	left: 0; width: 100%; z-index: 100; text-align: center; line-height: 0;}
#lightbox img{ width: auto; height: auto;}
#lightbox a img{ border: none; }

#outerImageContainer{ position: relative; background-color: #fff; width: 250px; height: 250px; margin: 0 auto; }
#imageContainer{ padding: 10px; }

#loading{ position: absolute; top: 40%; left: 0%; height: 25%; width: 100%; text-align: center; line-height: 0; }
#hoverNav{ position: absolute; top: 0; left: 0; height: 100%; width: 100%; z-index: 10; }
#imageContainer>#hoverNav{ left: 0;}
#hoverNav a{ outline: none;}

#prevLink, #nextLink{ width: 49%; height: 100%; background-image: url(data:image/gif;base64,AAAA); /* Trick IE into showing hover */ display: block; }
#prevLink { left: 0; float: left;}
#nextLink { right: 0; float: right;}
#prevLink:hover, #prevLink:visited:hover { background: url(images/prevlabel.gif) left 15% no-repeat; }
#nextLink:hover, #nextLink:visited:hover { background: url(images/nextlabel.gif) right 15% no-repeat; }

#imageDataContainer{ font: 10px Verdana, Helvetica, sans-serif; background-color: #fff; margin: 0 auto; line-height: 1.4em; overflow: auto; width: 100%	; }

#imageData{	padding:0 10px; color: #666; }
#imageData #imageDetails{ width: 70%; float: left; text-align: left; }	
#imageData #caption{ font-weight: bold;	}
#imageData #numberDisplay{ display: block; clear: left; padding-bottom: 1.0em;	}			
#imageData #bottomNavClose{ width: 66px; float: right;  padding-bottom: 0.7em; outline: none;}	 	

#overlay{ position: absolute; top: 0; left: 0; z-index: 90; width: 100%; height: 500px; background-color: #000; }
 
Mogli-Designz hat gesagt.:
Danke dir, also ich finde keine deiner beschriebenen Fehler :)
Hier mal der CSS-Code:

Code: 
#lightbox{	position: absolute;	left: 0; width: 100%; z-index: 100; text-align: center; line-height: 0;}
#lightbox img{ width: auto; height: auto;}
#lightbox a img{ border: none; }

#outerImageContainer{ position: relative; background-color: #fff; width: 250px; height: 250px; margin: 0 auto; }
#imageContainer{ padding: 10px; }

#loading{ position: absolute; top: 40%; left: 0%; height: 25%; width: 100%; text-align: center; line-height: 0; }
#hoverNav{ position: absolute; top: 0; left: 0; height: 100%; width: 100%; z-index: 10; }
#imageContainer>#hoverNav{ left: 0;}
#hoverNav a{ outline: none;}

#prevLink, #nextLink{ width: 49%; height: 100%; background-image: url(data:image/gif;base64,AAAA); /* Trick IE into showing hover */ display: block; }
#prevLink { left: 0; float: left;}
#nextLink { right: 0; float: right;}
#prevLink:hover, #prevLink:visited:hover { background: url(images/prevlabel.gif) left 15% no-repeat; }
#nextLink:hover, #nextLink:visited:hover { background: url(images/nextlabel.gif) right 15% no-repeat; }

#imageDataContainer{ font: 10px Verdana, Helvetica, sans-serif; background-color: #fff; margin: 0 auto; line-height: 1.4em; overflow: auto; width: 100%	; }

#imageData{	padding:0 10px; color: #666; }
#imageData #imageDetails{ width: 70%; float: left; text-align: left; }	
#imageData #caption{ font-weight: bold;	}
#imageData #numberDisplay{ display: block; clear: left; padding-bottom: 1.0em;	}			
#imageData #bottomNavClose{ width: 66px; float: right;  padding-bottom: 0.7em; outline: none;}	 	

#overlay{ position: absolute; top: 0; left: 0; z-index: 90; width: 100%; height: 500px; background-color: #000; }
Zum Vergrößern anklicken....

Ich auch nicht, da es sich um das Original-Stylesheet handelt - ein korrekter Pfad zu den beiden Hintergrundbildern vorausgesetzt :rolleyes:

Weil du meine nicht unbegründete Frage bzgl. des "Prev"-Buttons gelinde gesagt ignoriert, sowie den Code des Lightbox-Scripts nicht gepostet, wo du dich doch ans JS-Forum wendest, oder alternativ einen Link zum Problemkind genannt hast, und hier wohl niemand mit Seherfähigkeiten gesegnet wurde, sieht's für dich mit weiteren Vorschlägen erstmal mau aus, und ich bin hier raus, denn für so einen Auftritt ist mir meine Zeit echt zu schade :p
 
Zuletzt bearbeitet:
spicelab hat gesagt.:
Wir reden von http://www.huddletogether.com/projects/lightbox2/?
Zum Vergrößern anklicken....
Lightbox und Fancybox sind zwei Paar Stiefel - da kannst du im Lightbox-CSS lange suchen gehen, wenn Lightbox in der Seite überhaupt nicht (mehr) zum Zuge kommt :suspekt:

HTML: 
<!--<script type="text/javascript" src="http://www.uniontheater.de/js/prototype.js"></script>
<script type="text/javascript" src="http://www.uniontheater.de/js/scriptaculous.js?load=effects,builder"></script>
<script type="text/javascript" src="http://www.uniontheater.de/js/lightbox.js"></script>-->
Zum Vergrößern anklicken....
 
Klar, wie Kloßbrühe :-)

Ersetze im letzten <script>-Bereich (unmittelbar vor meinem zitierten Codeschnippsel) in dieser Zeile am Ende das "false" durch "true":

Javascript: 
  $("a[rel=lightbox]").fancybox({'showNavArrows': false});
 
Um antworten zu können musst du eingeloggt sein.

Neue Beiträge

Zurück