Auf Thema antworten

Beitrag

[QUOTE="Sempervivum, post: 14840, member: 3917"]
Es ist ganz schwierig, die Höhe dieses Headers mit CSS zu bestimmen und alle Eventualitäten zu berücksichtigen. Das lässt man besser den Browser machen, der kann es besser.
Etwas weiter ausgearbeitet würde mein Skript so aussehen:
[CODE]        function adjustScroll() {
            const
                nav = document.querySelector('.nav'),
                box = nav.getBoundingClientRect(),
                hNav = box.height,
                scrollingElems = document.querySelectorAll('.anchor');
            scrollingElems.forEach(scrollingEle => {
                scrollingEle.style.scrollMarginTop = hNav + 'px';
            });
            console.log(hNav);
        }
        adjustScroll();
        window.addEventListener('resize', adjustScroll);
[/CODE]
Relativ simpel, nicht wahr? Dazu musst Du dem Header die Klasse "nav" und den Ankern jeweils die Klasse "anchor" verpassen.
Habe ich wieder für die ersten drei Elemente in den Entwicklerwerkzeugen gemacht und es hat einwandfrei funktioniert.
Was noch fehlt ist, das Aufklappen zu  berücksichtigen. Versuche erst Mal, das so zu übernehmen und dann kümmern wir uns darum.
[/QUOTE]

Authentifizierung