Sticky Header - Content legt sich beim Scrollen über Header/Navigation
Hallo!
Ich habe diese Sticky Header Lösung in einer Contao 4.8 Installation übernommen und angepasst:
https://www.w3schools.com/howto/howt...bar_sticky.asp
Übernommen und angepasst habe ich folgendes CSS:
HTML-Code:
.sticky + #container {
padding-top: 60px;
}
.sticky {
position: fixed;
top: 0;
width: 100%;
}
Im Skript habe ich das Ermitteln der Navbar angepasst (entsprechend meiner vorhandenen CSS fürdie Navigation):
Code:
var navbar = document.getElementById("hor_navigation");
Eigentlich funktioniert das soweit gut. Die Navigation scrollt an den oberen Rand und bleibt 'hängen'.
Dann scrollt allerdings der restliche Teil über die Navigation (und verschwindet nicht unter diese) und ich weiß nicht warum.
Mit dieser Lösung hatte ich den gleichen Effekt:
https://blog.jst-media.de/sticky-header-in-contao/
Über jeden Tipp bin ich sehr dankbar.