Bilder auf der Startseite, Größe soll sich automatisch anpassen wie beim Slider

[mboo]

Hallo zusammen,

ich bin gerade dabei die Startseite unseres neuen JTL 4 Shops zusammenzustellen und kommme an einem Punkt nicht weiter.

Wir haben auf der Startsteite mehrere Bilder die sich in der größe je nach verwendeter größe der Auflösung des Endgerätes anpassen sollen. Im grunde genommen genauso wie der Slider.

Dazu habe ich versucht im CMS auf der Startseite den folgenden Quellcode einzugeben:


<img src="http://www.test.de/test.jpg" class="bild" width="474" height="66" alt="test" />

und in der entsprechenden custom.css

.bild { max-width: 100%; height: auto; }

Allerding nimmt mir die CMS das class="bild" beim speichern nicht an und löscht es immer wieder.

Kann ich das auch noch anders darstellen?

Vielen Dank im Voraus für eure Mühe.
Markus

 

[ag-websolutions.de]

AW: Bilder auf der Startseite, Größe soll sich automatisch anpassen wie beim Slider

Allerding nimmt mir die CMS das class="bild" beim speichern nicht an und löscht es immer wieder.

Problem ist bekannt ... siehe

http://forum.jtl-software.de/fehler...ehler-im-editor-eigene-seiten.html#post483385

 

[mboo]

AW: Bilder auf der Startseite, Größe soll sich automatisch anpassen wie beim Slider

Hallo,

Danke für den Tipp. Hat wunderbar geklappt.

VG
Markus

 

[ag-websolutions.de]

AW: Bilder auf der Startseite, Größe soll sich automatisch anpassen wie beim Slider

Schau dir auch mal die bootstrap class img - responsive an

 

[tsinus]

AW: Bilder auf der Startseite, Größe soll sich automatisch anpassen wie beim Slider

Hi,
ich arbeite gerade auch an dieser Themtik. Wenn ich beim Bild die class "img-responsive" angebe stört momentan der Eintrag "display: block". Also habe ich das wie mboo über meine Custom-Css-Datei mit

.bild {
max-width: 100%;
height: auto;
}

angegangen. Bei beiden Versionen habe ich immer noch das Problem, dass die Bilder zwar horizontal verkleinert werden, die Höhe bleibt aber unverändert
Mein Slider passt sich sowohl in der Breite, als auch in der Höhe wunderbar an.

Hat jemand einen Rat für mich?

 

[mboo]

AW: Bilder auf der Startseite, Größe soll sich automatisch anpassen wie beim Slider

Hallo,

wenn dein Bild den Eintrag class="img-responsive" hat muss der Eintrag in der Custom css Datei

.img-responsive {
max-width: 100%;
height: auto;
}

lauten.

Um mir mit den Voreingestellten class definitionen nicht ins gehege zu kommen habe ich einfach einen neuen class Namen vergeben. Der Name kann willkürlich sein, aber er muss beim bild und in der css gleich sein.

Vg
Markus

 

[ag-websolutions.de]

AW: Bilder auf der Startseite, Größe soll sich automatisch anpassen wie beim Slider

"img-responsive" ist eine vordefinierte css-class von bootstrap

 

[tsinus]

AW: Bilder auf der Startseite, Größe soll sich automatisch anpassen wie beim Slider

Also irgendwie klappt das nicht. In meiner CSS-Datei steht momentan:
.bild {
max-width: 100%;
height: auto;
}
In den drei Grafiken (24H-Service, Gut & Günstig, Zertifizierter Shop) https://www.golfballdrucker.de habe ich unter Image property / Advanced / Stylesheet classes die class "bild" eingetragen (wird auch so gespeichert und übernommen).
Template Cache gelöscht, Browsercache gelöscht. Beim zusammenschieben des Browsers verkleinert sich zwar der Slider einwandfrei, die drei Grafiken wandern untereinander, werden irgendwann auch in der Breite reduziert, aber die Höhe bleibt gleich.
Die Grafiken sollen sich aber proportional anpassen (verkleinern).