Bilder (als Hintergrund) entsprechend skalieren

[Sukrams]

Moin,

ich poste am besten gleich mal einen Link zum Pen: http://codepen.io/Sukrams/pen/KWvdaE

im Grunde soll es so aussehen und funktionieren wie oben. Also die Übergänge der Bilder einen Effekt bekommen, wie durch das background-attachment: fixed; erreicht wird. Allerdings sollen die Bilder immer korrekt skaliert werden, und so dargestellt werden, dass nichts abgeschnitten wird.

Ich persönlich meine das ist nicht wirklich möglich, oder gibts hier eventuell doch eine Möglichkeit?

Viele Grüße
Markus

[lucina]

Nicht alles passt immer ... ;-)

tumblr_inline_nrfo2ax1If1tq5e6u_500.gif

[pju]

Was genau meinst du mit "nichts abgeschnitten"?
Einfach background-size auf contain statt cover reicht nicht?

[Sukrams]

Nicht alles passt immer ... ;-)

tumblr_inline_nrfo2ax1If1tq5e6u_500.gif

das sag ich ja auch ;-)

Was genau meinst du mit "nichts abgeschnitten"?
Einfach background-size auf contain statt cover reicht nicht?

also im Prinzip soll er sicht contain verhalten, sollte aber die Fläche komplett, also wie cover, ausfüllen, dabei aber nichts abschneiden, was ja in meinen Augen eh schwer bis gar nicht geht. Selbst wenn du ein Bild druckst hast du je nach Format mehr oder weniger Beschnitt.

[pju]

Das ginge natürlich, wenn Hochformat-Bilder dann scrollen, oder? Versteh ich dich da richtig?
Dann bräuchtest du für den Übergang allerdings wahrscheinlich eine Javascript-Lösung, soweit ich das überblicken kann.

[Sukrams]

Das ginge natürlich, wenn Hochformat-Bilder dann scrollen, oder? Versteh ich dich da richtig?
Dann bräuchtest du für den Übergang allerdings wahrscheinlich eine Javascript-Lösung, soweit ich das überblicken kann.

Normalerweise schon, das Problem ist halt nur, dass ich keine Hochformatbilder habe... Habe schon überlegt, ob man das irgendwie mit einem Parallax machen kann, dass das vielleicht auch nur ganz leicht mitscrollt.