• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

Menü formatieren in Abhängigkeit von Position innerhalb der Seite

Heppi

Neues Mitglied
Hallo zusammen,

ich habe eine Seite erstellt, welche ein Onepager ist. Dabei bleibt das Menü oben angepinnt und mit dem Menü springe ich über Anker an bestimmte Positionen in der Seite.
Allerdings hätte ich gern, daß das Menü entsprechend der aktuellen Position auf der Seite gehighlightet ist.
Also ich springe mit dem Menü zum Beispiel an den Punkt "Aktuelles" und dann sollte "Aktuelles" im Menü eine andere Farbe bekommen. Wenn ich dann unten innerhalb der Seite weiterscrolle in den nächsten Bereich, dann soll der gehighlightete Menüpunkt wandern. Ich hoffe, daß das so weit verständlich war :-D
Kann mir da jemand auf die Sprünge helfen, wie das geht?
Danke euch schon mal :-)

Schöne Grüße, Heppi.
 
Werbung:
Ist eigentlich ganz einfach:
Setze Ankerpunkte, an dem das Menü einen anderen Punkt highlighten soll. Lies mit JS das Top-Offset des Ankers aus.
Dann setzt du einen Scroll-Event-Listener, der die Scrollposition des Fensters ausliest.

Ab dann greifen einfache if-Bedingungen.
if(Scrollposition > offset vom Anker && Scrollposition < offset vom Anker darüber) {
CSS des Menüs verändern.
}
 
Zurück
Oben