Table of Contents: How to scroll an element other than the page/window

How To
1

I’m trying to implement the new Table of Contents element for a ‘Podcast Transcript’ section, and trying to keep the full podcast transcript inside an element with a max-height, so that the transcript text scrolls within the element.

The ToC works great for building a nav from the content using the ‘Content Selector’, but clicking any element causes the whole page to scroll, instead of the Content Selector element. Obviously my implementation is a little unique… but is there a way to modify the scrolling javascript to target the ‘Content Selector’ element instead of the page/window?

2

Hey Kyle,

would you be so kind to share link to your site so I can see the setup in action? That’d make it a lot easier to think about a possible solution.

Best,

André

1 Like
3

@aslotta thanks for the quick reply!

Here is the page in question, but note: this site is being developed very rapidly (we’re planning to launch on 08/15, in 4 days) so I may need to roll something custom for launch.
https://devratio.wpengine.com/podcast/empowering-care-hcas-journey-to-quality-care-through-tech-partnerships
(the Transcript section)

I did try to recreate the setup on a ‘trybricks’ account, but the Bricks version is not the latest, and there is no way to update (that I can find): TOC test – Try Bricks – t80e1fb8
Anyway it should give you an idea what I’m working with.

Thanks again