How to get that "vertical scroll with TOC" in a framework.

Community Help
1

Sorry to post a “what do you call that thing” question, but I simply don’t know what to google …

Please see the attached screenshot from an Observable framework library. Notice that the topmost item of the left sidebar is selected. Of course, this corresponds to the index.md page in the frameworks src directory.

Now, in some data visualizations, you’ll see navigation in which the user scrolls down a continuous page, and as they do so, successive elements of the toc are highlighted. The user can either select the toc element to jump to a place on the page, or scroll the page to a waypoint and have the toc element highlighted. – My questions are: what is the common term of work for this kind of navigation? What should I google? And: is there an example framework that shows how to implement such navigation?

Thanks for your advice.

Screenshot 2024-07-19 at 11.28.59
Screenshot 2024-07-19 at 11.28.593282×1426 316 KB

2

I think that what you want is the default table of contents feature of Framework. You can see the documentation for that here: Configuration | Observable Framework, and on that page you can see the table of contents on the right side updating as you scroll. You can also turn that feature on and off on individual pages with the Markdown front matter (docs for that at Markdown | Observable Framework)

3

Thanks, that’s just it.