Ist sowas mit CSS möglich oder brauch ich da JavaScript?
Nein, du brauchst JavaScript.
Wenn ich JavaScript brauche, vielleicht hat jemand einen Link - ich hab schon danach gesucht, wahrscheinlich mit den Falschen Schlagworten.
Vorn weg: Logo1 ist das statische Logo, Logo2 ist jenes, welches sich im Header befindet.
An sich brauchst du (zusätzlich) nur eine Klasse die Logo2 versteckt. Ich nenn sie mal für weiteres hidelogo
Mittels scroll-Event kannst du auf scrollen reagieren. Du ermittelst einfach nur ob Logo1 sichtbar ist, wird hidelogo aus der Klassenliste von Logo2 herausgenommen, wenn Logo1 nicht sichtbar ist, wird die hidelogo Logo2 hinzugefügt.
Stichworte für scroll-Event wären unter google (oder welche SuMa du auch immer verwendest) javascript event scroll onscroll
https://developer.mozilla.org/en-US/docs/Web/API/window.onscroll 3. Treffer
Stichworte für das hinzufügen/entfernen von Klassen wären wohl javascript add remove class
http://stackoverflow.com/questions/195951/change-an-elements-css-class-with-javascript 1. Treffer
Das sollte dir genug Informationen geben um die Lösung auszuarbeiten.
Angemerkt sei, dass Smartphones scroll-Events und fixe Elemente nicht unbedingt mögen.
MfG
bubble
If "god" had intended us to drink beer, he would have given us stomachs. - David Daye