Fixed/Unfixed Background scrolling content

I’m making a page that I want to have the effect of, when you scroll to a section, once that section’s background reaches the top, it affixes until the last of the content for that section has scrolled into the viewport and then it resumes scrolling with the content as the next section scrolls into view.

I’ve been googling, but I can’t seem to come up with a search term that properly gets my intent across to find a useful response.

Hey, have a look at this site. I made a codepen of it.

That might work. I’d have to do some digging to change it from headings to background but I think I can see a way to make it work we’ll see. Thanks.

Making progress: $(document).scrollTop() - $('#portfolio').offset().top

1 Like