Streaming live at 10am (PST)

How to have a fixed background for a section


#1

Hey guys,

I am just learning front end. I was looking at the template that webflow has that say "This is a smaller title in front of a fixed background" and when I scroll the other sections come on top of it. How can I replicate this? I tried doing it on slate, but when I put the background as fixed, it disappears. Thank you.


#2

Having a fixed background does create the illusion that other elements scroll on top of it, but in reality it doesn't. Let's say you have a div that's 400px tall with a fixed background image. That will cause only 400px of the image to be shown, but when you scroll it will begin to show the top or bottom portion of the image when scrolling up or down. It's essentially hiding the other areas of the image until you scroll them into view.

Setting the background image behind the iPhone in the Slate template to "fixed" should do exactly what you are wanting it to do. If it's not, I'm wondering if you might have at some point changed another setting that would cause the image to disappear. Can you provide your public link so we can be of better help?


#3

Hey Craig,

Thank you for the explanation, that makes much more sense.

When I try it on a clean slate page, it works, when I try it on the one I am working on it does not.

https://webflow.com/design/mobilapse?preview=5cff86840d80f8aed20492bde7d162f8

Thanks again


#4

is it possible to have 2 fixed sections on the background


#5