Responsive Thumbnails

1 week 5 days ago #10984 by fawin

Responsive Thumbnails was created by fawin

Hallo Viktor,

ich nutze die SIGE für eine Bildergalerie und steuere die (kleinen) Thumbnails über die Plugineinstellungen.

Nun möchte an mehreren Stellen ein großes Thumbnail (Breite 1200px) einsetzen (Syntax: {gallery}ordner,single=bild.jpg,width=1200,height=800,connect=ordner{/gallery}). Leider ist das Thumbnail dann nicht responsive und es schiebt sich bei kleineren Bildschirmen über das Elternelement.

Meine Frage: Wie bekomme ich große Thumbnails resposive?

This message contains confidential information

Vielen Dank und viele Grüße

fawin

fawin
Topic Author
Offline
Fresh Boarder

6 days 15 hours ago #10986 by fawin

Replied by fawin on topic Responsive Thumbnails

Hallo Viktor,

ich will nicht unhöflich sein, aber konntest du dir das Problem schon ansehen?

Gruß

fawin

fawin
Topic Author
Offline
Fresh Boarder

1 day 11 hours ago #10991 by Vitja

Replied by Vitja on topic Responsive Thumbnails

Hi fawin,

es tut mir leid, dass ich mich erst jetzt melde. War ziemlich eingespannt und konnte es mir leider nicht früher anschauen. Ich habe deine Subscription um eine Woche verlängert!

Du kannst das relativ einfach lösen. Füge folgende CSS Anweisung hinzu (am besten in eine custom.css, wenn das dein Template unterstützt):

.sige_single li {
    height: 100%;
    width: 100%;
}

Damit wird das Einzelbild passend skaliert, auch für kleine Bildschirme.

Viele Grüße

Kubik-Rubik Joomla! Extensions

Please support my work with a review in the Joomla! Extensions Directory: extensions.joomla.org/profile/profile/details/61997

Vitja
Offline
Entwickler / Developer

14 hours 45 minutes ago - 14 hours 44 minutes ago #10995 by fawin

Replied by fawin on topic Responsive Thumbnails

Hallo Viktor,

vielen Dank für deine Antwort, das funktioniert schonmal super!

Aber ein Sonderfall macht mir noch Sorgen.

Auf dieser Seite

This message contains confidential information

Soll das Thumbnail vom Text umflossen werden (Plakat Links, Text Rechts) und sich bei kleinen Bildschirmen verkleinern.

Bisher habe ich das so gelöst:

Modul

<div class="plakat-schuetzenfest">{gallery}schuetzenfest,height=600,width=565,watermark=0,plakat.png{/gallery}</div>

und entsprechendendes css

.plakat-schuetzenfest {
    float: left;
    margin-right: 10px;
}

Wenn ich das css jetzt wie folgt ergänze,

.plakat-schuetzenfest {
    float: left;
    margin-right: 10px;
    height: 100%;
    width: 100%;
}

wird das Plakat nicht mehr vom Text "umflossen" und verkleinert sich auch nicht.

Hast du eine Idee, wie ich das lösen könnte?

Vielen Dank und viele Grüße

fawin

Last edit: 14 hours 44 minutes ago by fawin.

fawin
Topic Author
Offline
Fresh Boarder

Time to create page: 0.159 seconds