Jump to content

How can I create a block that scrolls on one side, but has a locked image on the other?

Recommended Posts

Site URL: https://nayatraveler.squarespace.com/journeys-peru-walking

On the site linked, scroll down to 'The Journey' section. I'm trying to figure out how to make our homepage very similar to this. Where there is an image at the top, then you scroll down and see another image with text, and as you keep scrolling the text also keeps scrolling, but the image either stays the same, or is in an automated carousel. 

Anyone know how to do this? Or, anyone know of any templates currently on squarespace that has this feature???

Link to comment
  • Replies 4
  • Views 319
  • Created
  • Last Reply

Top Posters In This Topic

They used Index Page.

Added 2 sections, then use this code to make them side by side & make left sticky

@media (min-width: 960px) {
    .Index {
        display:-webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap
    }

    .Index-page {
        width: 100%
    }

    .Index-gallery {
        width: 100%
    }

    section[id*='split-left'] {
        width: 50% !important;
        padding: 0px 0px;
        overflow: inherit
    }

    section[id*='split-right'] {
        width: 50% !important;
        padding: 0px 0px;
        margin-top: 0px;
        margin-bottom: 0px !important
    }
}

 

Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

Contact Customer Care - Learn CSS - Buy me a coffee (thank you!)

Link to comment
  • 2 months later...
 

We are trying to achieve this as well with the new fluide engine that no longer supports index pages.

Thank you.

Site URL: https://nayatraveler.squarespace.com/journeys-peru-walking

On the site linked, scroll down to 'The Journey' section. I'm trying to figure out how to make our homepage very similar to this. Where there is an image at the top, then you scroll down and see another image with text, and as you keep scrolling the text also keeps scrolling, but the image either stays the same, or is in an automated carousel. 

Anyone know how to do this? Or, anyone know of any templates currently on squarespace that has this feature???

Link to comment
On 11/1/2022 at 11:24 PM, EGWmagazine said:

 

We are trying to achieve this as well with the new fluide engine that no longer supports index pages.

Thank you.

Site URL: https://nayatraveler.squarespace.com/journeys-peru-walking

On the site linked, scroll down to 'The Journey' section. I'm trying to figure out how to make our homepage very similar to this. Where there is an image at the top, then you scroll down and see another image with text, and as you keep scrolling the text also keeps scrolling, but the image either stays the same, or is in an automated carousel. 

Anyone know how to do this? Or, anyone know of any templates currently on squarespace that has this feature???

Do you still need this?

The site you sent is Squarespace 7.0 - I don't know which template, but this templates need to support Index Page

Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

Contact Customer Care - Learn CSS - Buy me a coffee (thank you!)

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.