Druckbare Version
Hallo Sabri und Contao-Freunde,
ich hätte gerne gewusst ob das Vorschaubild irgenwo auf 100% einstellbar ist in irgendeiner
datei, hab leider nichts gefunden wo könnte diese Einstellung sein...
Vorschaubild hat einen Rahmen mit 100x100 pixel
und darin soll das Bild 100% mittig eingesetzt werden können
das eigentliche Bild in der Lightbox hat 640x480
liebe grüße
elukas
100% von was? Qualität? Oder möchtest du das Original-Bild, in Original-Größe, zentriert in einer Box von 100x100px darstellen?
Grüße
Hallo Andreas,
ja ich möchte das originale Bild also 100% in der Box 100x100
mittig darstellen... so das nur der mittlere Bereich gezeigt wird.
Wenn das Bild dann anklickt soll das ganze sichtbar sein.
Lg elukas
Dann versuch mal keine Werte für die Thumbs einzutragen, dann müsste schon mal das Original im FE erscheinen. Nun versuche dein Ziel mit der CSS-Eigenschaft 'clip' zu lösen. Sobald du Werte für die Thumbs einträgst werden sie natürlich auch in der gewünschten Größe erzeugt, was du ja nicht möchtest.
http://de.selfhtml.org/css/eigenscha...erung.htm#clip
Grüße
Hallo Andreas,
sorry war die ganze Woche ohne Internet...
Hab versucht Deine Idee umzusetzen aber ich hab leider kein erfolgreiches Ergebnis erreicht muss mir wahrscheinlich was anderes überlegen... vielen Dank für Deine Hilfe
Liebe Grüße
elukas
Da fällt mir grad auf, wir sind ja im Forum imagerotator/-slider. Sollte dir folgendes nicht hilfreich sein, dann sag einfach Bescheid. Ich verschiebe es dann in ein anderes Forum.
So, ich hab das mal probiert. Hier das Ergebnis.
Vorher:
BE->Anhang 2739 FE->Anhang 2742
Nachher:
BE->Anhang 2740 FE->Anhang 2743
Und hier noch das CSS für 'Nachher'.
Jetzt ist das Thumb und das Bild in der Mediabox ein und dasselbe. Das hat den Vorteil, dass die Bilder für die Großansicht bereits geladen sind, was gleichzeitig natürlich auch ein Nachteil ist, da die Pseudo-Thumbs ja länger zum laden brauchen.Code:.ce_gallery td {
height: 176px;
padding: 24px 24px 0 0;
vertical-align: top;
}
.ce_gallery .image_container {
position: relative;
width: 200px;
height: 140px;
}
.ce_gallery .image_container a {
display: block;
position: absolute;
height: 140px;
width: 200px;
left: 0;
top: 0;
overflow: hidden;
clip: rect(0px, 200px, 140px, 0px);
}
.ce_gallery img {
margin: -105px 0 0 -150px;
}
.ce_gallery .caption {
position: absolute;
left: 0;
top: 140px;
}
Grüße
Lieber Andreas,
danke für deine tolle Beschreibung hat prima funktioniert...:D
lg Lukas