[TYPO3-german] Lightbox-Funktion
Jens Hansen
jens.hansen at 1024x768.net
Sat Jan 17 18:46:53 CET 2015
Hallöchen,
ich habe ein Problem mit meiner Lightbox...
Ich habe Typo3 aufgesetzt und eine Lightbox verwendet. (Lightbox-Quelle: github.com/lokesh/lightbox2)
Beispielgalerie hier:
1024x768.net/cms/index.php?id=14
Das Problem ist Folgendes: Die Lightbox wird aufgerufen, auch die Ladegrafik funktioniert und auch der Closer, allerdings funktioniert die "vor" und "zurück"-Funktion nicht.
Vielleicht hat jemand eine Idee oder kann mir sagen, warum das so ist und hat vielleicht einen Lösungsvorschlag!?!
Die wahrscheinlich dazugehörigen Codefragmente sind im JS:
[code lang=javascript]
if (this.album.length > 1) {
if (this.options.wrapAround) {
if (alwaysShowNav) {
this.$lightbox.find('.lb-prev, .lb-next').css('opacity', '1');
}
this.$lightbox.find('.lb-prev, .lb-next').show();
} else {
if (this.currentImageIndex > 0) {
this.$lightbox.find('.lb-prev').show();
if (alwaysShowNav) {
this.$lightbox.find('.lb-prev').css('opacity', '1');
}
}
if (this.currentImageIndex < this.album.length - 1) {
this.$lightbox.find('.lb-next').show();
if (alwaysShowNav) {
this.$lightbox.find('.lb-next').css('opacity', '1');
}
}
}
}
};
[/code]
und im CSS:
[code lang=css]
lb-nav a {
outline: none;
background-image: url('data:image/gif;base64,R0lGODlhAQABAPAAAP///wAAACH5BAEAAAAALAAAAAABAAEAAAICRAEAOw==');
}
lb-prev, .lb-next {
height: 100%;
cursor: pointer;
display: block;
}
lb-nav a.lb-prev {
width: 34%;
left: 0;
float: left;
background: url(../template/img/prev.png) left 48% no-repeat;
filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
opacity: 0;
-webkit-transition: opacity 0.6s;
-moz-transition: opacity 0.6s;
-o-transition: opacity 0.6s;
transition: opacity 0.6s;
}
lb-nav a.lb-prev:hover {
filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
opacity: 1;
}
lb-nav a.lb-next {
width: 64%;
right: 0;
float: right;
background: url(../template/img/next.png) right 48% no-repeat;
filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
opacity: 0;
-webkit-transition: opacity 0.6s;
-moz-transition: opacity 0.6s;
-o-transition: opacity 0.6s;
transition: opacity 0.6s;
}
lb-nav a.lb-next:hover {
filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
opacity: 1;
}
[/code]
Ich hoffe, ich habe nichts vergessen, ansonsten gerne Feedback und ich hoffe, Ihr könnt mir helfen!
LG Jens
More information about the TYPO3-german
mailing list