<img> + responsive width/height + Seitenaufbau = :(
Verfasst: 8. Jul 2014, 14:34
Weil das Grundproblem nur eingeschränkt mit Redaxo zu tun hat, versuche ich es mal hier zu beschreiben:
Auf http://tanzschule-woelbing.de/ hat es ja je mind 1 Bild in der Kopfzeile.
Dieses Bild erhält im Prinzip folgende Eigenschaften, um mit sinkender Auflösung mit zu skalieren.
Bei Highspeed-Internet alles kein Problem, das Bild ist quasi sofort da. Aber bei einer langsamen Internet-Verbindung verschwindet das nicht geladene Bild erst mal und wenn das Bild geladen ist "springt" der Seiteninhalt nach unten, um Platz für das Bild zu machen.
Früher hätte man einfach feste Höhen/Breiten angegeben - aber als Responsive Image wäre eine feste Höhe eben tödlich.
Kennt ihr einen guten Weg, wie man es schafft, dass die Höhe von Anfang korrekt berechnet wird, auch wenn das Bild noch nicht da ist und ohne die Responsive-Eigenschaft zu verlieren?
Auf http://tanzschule-woelbing.de/ hat es ja je mind 1 Bild in der Kopfzeile.
Dieses Bild erhält im Prinzip folgende Eigenschaften, um mit sinkender Auflösung mit zu skalieren.
Code: Alles auswählen
.hero img {
width:100%
height: auto;
}
Früher hätte man einfach feste Höhen/Breiten angegeben - aber als Responsive Image wäre eine feste Höhe eben tödlich.
Kennt ihr einen guten Weg, wie man es schafft, dass die Höhe von Anfang korrekt berechnet wird, auch wenn das Bild noch nicht da ist und ohne die Responsive-Eigenschaft zu verlieren?