Jump to content

Sticky Section

Recommended Posts

password: writer 

Hi, I am using the following code for sticky sections, however, it is making my entire homepage sticky, when I want to isolate just one of the section (the bottom 2). What should I add to the code to isolate a section? 

#page .page-section {
position: sticky!important; 
top: 0px!important
} 
html {
scroll-behavior: smooth
} 

 

Edited by kaydotjpg
Link to comment
  • Replies 1
  • Created
  • Last Reply

Top Posters In This Topic

Popular Days

Top Posters In This Topic

Hey Kay,

You just need to target the section ID instead. I tested it on an example site and this is what worked:

section[data-section-id="63b7ed0104aa2c06285e5e7c"] {
position: sticky!important; 
top: 0px!important
} 
html {
scroll-behavior: smooth
} 

Just replace the 'section[data-section-id]' part with the relevant ID.

Sam Crawford | by Crawford.
 
Multi-award-winning Squarespace expert
 
Did my comment help? To help others benefit, leave a like and mark my answer as 'best'. This lets users scroll straight to the solution they need.
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.