Hi zusammen.
Ich versuche#cboxClose (oben rechts), #cboxPrevious (mitte links) und #cboxNext (mitte rechts) absolut zu positionieren. Mit purem CSS scheint das nicht so ohne weiteres umsetzbar. Irgendwelche Tipps?
Hi zusammen.
Ich versuche#cboxClose (oben rechts), #cboxPrevious (mitte links) und #cboxNext (mitte rechts) absolut zu positionieren. Mit purem CSS scheint das nicht so ohne weiteres umsetzbar. Irgendwelche Tipps?
Warum nicht? Link zur Seite?
Ja, die sind bereits absolut positioniert. Siehe demo.contao.org.
Ansonsten hatte ich mir die Colorbox in Contao 3.5 mal so angepasst, dass ich nicht auf die Pfeile für next und previous zielen muss, sondern direkt jeweils die Hälfte des Bildes ein next oder previous auslöst. Hier das CSS:
PHP-Code:
/* ... Colorbox click 50/50 ...
-------------------------------------------------------------------------------------------------*/
#cboxPrevious,
#cboxNext {
background: transparent;
width: 50%;
height: 100%;
top: 0;
margin-top: 0;
}
#cboxPrevious {
left: 0;
}
#cboxNext {
right: 0;
}
#cboxPrevious:before,
#cboxNext:before {
background-image: url("../../assets/jquery/colorbox/1.6.1/images/controls.png"); /* Contao 3.5 */
/* background-image: url("https://demo.contao.org/assets/colorbox/images/controls.png"); Contao 4 */
position: absolute;
width: 28px;
height: 65px;
top: 50%;
margin-top: -33px;
content: '';
}
#cboxPrevious:before {
background-position: left top;
left: 5px;
}
#cboxNext:before {
background-position: right top;
right: 5px;
}
#cboxPrevious:hover:before {
background-position: left bottom;
}
#cboxNext:hover:before {
background-position: right bottom;
}
/* ... Colorbox click 50/50 ... END
-------------------------------------------------------------------------------------------------*/
Geändert von Andreas (10.02.2018 um 00:31 Uhr)
Bitte!
Vor Anfragen im Forum HTML validieren.
Codesnippets hier im Froum sauber einrücken. Nur Tabs o. nur Leerzeichen verwenden.
Vielen Dank an alle Wunschlistenerfüller
Andreas Burg, Web Solutions
Das ist auch nicht so einfach, weil einige Elternelemente auf overflow:hidden und position:not-static stehen. Deswegen sieht man sie zum einen nicht bei Neuausrichtung außerhalb des parents und zum anderen orientiert sich die Positionierung am ersten parent mit position:not-static.
Bitte!
Vor Anfragen im Forum HTML validieren.
Codesnippets hier im Froum sauber einrücken. Nur Tabs o. nur Leerzeichen verwenden.
Vielen Dank an alle Wunschlistenerfüller
Andreas Burg, Web Solutions
Hab jetzt ne andere Lightbox eingebaut, ist wohl unkomplizierter.
Z.B. so:
Siehe auch hier: http://www.jacklmoore.com/colorbox/#setting-dimensionsPHP-Code:
// Put custom options here
...
maxWidth: '100%',
maxHeight: '100%',
width: '100%',
height: '100%'
...
Bitte!
Vor Anfragen im Forum HTML validieren.
Codesnippets hier im Froum sauber einrücken. Nur Tabs o. nur Leerzeichen verwenden.
Vielen Dank an alle Wunschlistenerfüller
Andreas Burg, Web Solutions
Aktive Benutzer in diesem Thema: 1 (Registrierte Benutzer: 0, Gäste: 1)
Lesezeichen