Jump to content

Sticky or paralax Backgrounds When Scrolling, Not stuck to the Top

Recommended Posts

Hey all! So I've used some css to make sections sticky, 

((section ID

then added

{position: sticky!important; top: 0px; z-index: -1;})) which works nice,

but, I can't seem to figure out how to make a section background stuck when scrolling so that both the section above and below are scrolling along.

I'll use the example of this home page by Macarons&Mimosas (https://macaronsandmimosas.com/) when you scroll down the page, you'll see the backgrounds similar to a paralax, but they're in fact stuck when scrolling both up and down. Can anyone here lend some ideas for CSS?

I hope that makes sense. I'm also not looking for paralax scroll that we would have in our image effects either. This effect still has some movement to it as you scroll up or down.

I appreciate any help! Have a great weekend!

Link to comment
  • Replies 2
  • Views 356
  • Created
  • Last Reply

Top Posters In This Topic

Posted (edited)

I don’t have any code for this query on my site rn. What I mentioned before, I removed it.

Just looking for code that will give the result of the link I provided. Does that make sense?

Edited by janeldamiani
Link to comment

Create an account or sign in to comment

You need to be a member in order to leave a comment

  • Create New...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Hire a Designer

Stand out online with the help of an experienced designer or developer.