Marc89: Div mit fixed-parent soll aus parent rauscrollen

Beitrag lesen

Lieber Gunnar

Danke für die ausführlichen Tipps!

Hättest du gleich gesagt, dass du das Logo nach beim Runterscrollen verkleinern/verschieben willst (und nicht, dass es „normal mit der Seite mitscrollen soll“), hätte man dir gleich sagen können: JavaScript.

Ursprünglich wollte ich eigentlich, dass das Logo anfangs mitscrollt und dann oben fixiert wird. Dass Fixieren wollte ich immer mit JavaScript lösen, deshalb habe ich nur die Frage nach dem Mitscrollen gestellt.

Allerdings ist die Verschiebung aus Performanzgründen besser mit translateY() gemacht. Spätestens, wenn du eine Transition einbaust (was sich hier anbietet), solltest du das eher so umsetzen:

.user-scrolled #divLogo { transform: translateY(-90px) }

Aktuell "springt" aber das Logo noch, anstatt mitzuscrollen, deshalb werde ich dass sicherlich noch ausprobieren.

Anmerkung zum Logo selbst:

<a class="navbar-brand" href="http://new.cevimoenchi.ch"><div id="divLogo"></div></a>

Da ist kein Inhalt. Nicht, wenn das Hintergrundbild nicht geladen wird. Nicht für Nutzer, die keine Bilder sehen können. Der Link zur Startseite ist nicht bedienbar.

Für Nutzer assistiver Technologien könnte man mit aria-label nachhelfen; besser ist aber, es richtig zu machen. Wie ich schon sagte: img-Element – mit alt-Text.

Stimmt, wird angepasst 😀

LG, Marc