Autor |
Nachricht |
jen83
Threadersteller
Dabei seit: 28.07.2009
Ort: -
Alter: -
Geschlecht: -
|
Verfasst Di 28.07.2009 10:14
Titel Lightbox 2 |
|
|
Hallo
Ich will den Lightbox2 Effekt benutzen, will aber nicht alle Bilder abblden. Das heißt: Ich will ein Bild abbilden und den Effekt aufrufen und dann 3 weitere Bilder durchblättern lassen.
Geht das? und wenn ja wie? ich hoffe ihr habt mein Problem überhaupt verstanden
Danke und schönen Gruß
|
|
|
|
|
denise2302
Dabei seit: 12.09.2006
Ort: Leipzig
Alter: 34
Geschlecht:
|
Verfasst Di 28.07.2009 10:17
Titel
|
|
|
Code: |
<a href="deinbild1.jpg" rel="wahrscheinlichlightbox[gruppe]"><img src="kleinesbild1.jpg" /></a>
<a href="deinbild2.jpg" rel="wahrscheinlichlightbox[gruppe]"><img style="display: none;" src="kleinesbild2.jpg" /></a>
<a href="deinbild3.jpg" rel="wahrscheinlichlightbox[gruppe]"><img style="display: none;" src="kleinesbild3.jpg" /></a>
|
du kannst auch eine klasse anlegen und dies dann ins css schreiben zb
Code: |
<a href="deinbild1.jpg" rel="wahrscheinlichlightbox[gruppe]"><img src="kleinesbild1.jpg" /></a>
<a href="deinbild2.jpg" rel="wahrscheinlichlightbox[gruppe]"><img class="hidden" src="kleinesbild2.jpg" /></a>
<a href="deinbild3.jpg" rel="wahrscheinlichlightbox[gruppe]"><img class="hidden" src="kleinesbild3.jpg" /></a>
|
und im css:
Code: |
.hidden { display: none; }
|
Zuletzt bearbeitet von denise2302 am Di 28.07.2009 10:18, insgesamt 1-mal bearbeitet
|
|
|
|
|
Anzeige
|
|
|
jen83
Threadersteller
Dabei seit: 28.07.2009
Ort: -
Alter: -
Geschlecht: -
|
Verfasst Di 28.07.2009 10:22
Titel Dankeschön |
|
|
Danke für die schnelle Hilfe. Das sieht ja ganz einfach aus. Werde ich gleich ausprobieren.
|
|
|
|
|
denise2302
Dabei seit: 12.09.2006
Ort: Leipzig
Alter: 34
Geschlecht:
|
Verfasst Di 28.07.2009 11:22
Titel
|
|
|
naja im prinzip wird mit display: none das bild versteckt. im code ist es aber da und somit erscheint es trotzdem in der lightbox. ich hab das auch mal so eingesetzt
|
|
|
|
|
jen83
Threadersteller
Dabei seit: 28.07.2009
Ort: -
Alter: -
Geschlecht: -
|
Verfasst Mo 07.09.2009 14:25
Titel
|
|
|
Hallo ich habe noch eine Frage zur Lightbox!
Ich möchte gerne das die next und prev button dauerhaft angezeigt werden.
Hier ist der lighbox.css 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; }
Vielen Dank schon mal!
|
|
|
|
|
ApfelQFeierabend
Dabei seit: 05.04.2008
Ort: Regensburg
Alter: 37
Geschlecht:
|
Verfasst Mo 07.09.2009 20:02
Titel
|
|
|
mach aus
Code: | #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; } |
Code: | #prevLink { background: url(../images/prevlabel.gif) left 15% no-repeat; }
#nextLink { background: url(../images/nextlabel.gif) right 15% no-repeat; }[/quote] |
|
|
|
|
|
jen83
Threadersteller
Dabei seit: 28.07.2009
Ort: -
Alter: -
Geschlecht: -
|
Verfasst Do 03.12.2009 18:05
Titel Abdunkeln |
|
|
So ich schon wieder!
Ich habe noch ein Problem in Sachen Lightbox 2
Die Abdunklung geht nicht über die ganze Seite. Rechts bleibt ein Rand stehen.
Weiß jemand was ich falsch gemacht habe oder woran es liegen kann.
|
|
|
|
|
Kash
Dabei seit: 07.11.2002
Ort: Schopfheim
Alter: 41
Geschlecht:
|
Verfasst Do 03.12.2009 18:09
Titel
|
|
|
Bitte poste das Online Beispiel.
|
|
|
|
|
|
|
|
Ähnliche Themen |
Lightbox
lightbox js on startup
Lightbox und ScrollPane
Kontakform via Lightbox
2 Bilder in der Lightbox
bin zu dumm für lightbox
|
|