Streaming live at 10am (PST)

Nav text that changes at anchor locations

Hi All,

I’m looking to create a responsive secondary navigation for a brand guideline site I’m working on. Currently, on desktop displays, the nav snaps to the left of the page with a more granular view of that page’s content than the main top nav provides. I’d like that secondary nav to snap to the top of the page on tablet and mobile views, with nav text that changes as the user scrolls past anchor locations. Essentially displaying the anchor links that are on the left of the pages desktop view.

Here’s a link with a good example of what I’m trying to achieve. (make sure to inspect and view the pages tablet or mobile views).
https://brand.uber.com/guide#logo-overview

Does anyone know of any tutorials or tips to achieve this effect?

Thanks!
-Trevor


Here is my site Read-Only:
https://preview.webflow.com/preview/brand-guidelines-2020?utm_medium=preview_link&utm_source=designer&utm_content=brand-guidelines-2020&preview=889f79ff9801c160c2846f231e96ff19&pageId=5f5fbdf66d9ff811b567b4da&mode=preview

@PixelGeek Any ideas?