Einzelnen Beitrag anzeigen
  #1 (permalink)  
Alt 28.11.2020, 18:34
kanuddel kanuddel ist offline
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 28.11.2020
Beiträge: 2
kanuddel befindet sich auf einem aufstrebenden Ast
Standard Bildhöhe variabel zu Breite

Hallo zusammen,

ich hbe eauf meiner Seite einige Bilder, die mit eine max-width von 100% dafür sorgen, dass es auch mobil gut aussieht.

Nun ist es so dass durch die Ladezeiten der Bilder ein Cumulative Layout Shift entsteht den ich verhindern will.

Normalerweise geht das ganzeinfach, indem ich ein <div> um das Element baue und dem Div die entsprechende Höhe des fertig geladneen Inhalts gebe.

Nun ist die Höhe der Bilder aber nicht klar, sondern abhängig von der Breite des Bildschirms, bzw des Divs in dem sie sind.

Da die Bilder alle gleich sind, und somit auch der Aspekt zwischen Höhe und breite immer gleich ist, könnte ich - falls es das gibt - dies lösen indem ich die height abhängig von der aktuellen width festlege. Also z.b. height: 0,75*[aktuelle witdh dieses Elements].

Kann CSS sowas oder muss das zwingend mit JS gemacht werden, worauf ich gerne verzhten würde.

Danke für eure Mühe,

kanuddel
Mit Zitat antworten
Sponsored Links