Iam having a tough time figuring what I am doing wrong. please click on the Arch Photography page and can you guys tell me how to make the back ground rooks image NOT scroll.
Looks like you found it? Setting looks correct to me. See attached screen for you background settings. Currently set to “fixed” which keeps it from scrolling. Let me know if you were trying to do something different.
ok. Fix the scrolling part but now that broke my interactions. can anyone look at it and see what the heck went wrong. look at the ARCH PHOTOGRAPHY. Notice my sliding pics dont all slide into view? If I uncheck overflow back to "visible on the body… it fixes it but then the background scrolls again.
well… ill stop trying different methods until one of the experts gives a better hint on this. remember that all I am seekng is a Static Background and have the pics scroll up and down with the sliding effect.
Hi there, just on my phone so can’t see the preview but it seems to me that whatever in in the body is affected by the Body styling so…
Select the body, add 2 divvs, call the first Background then style 100vw 10 VH position fixed, add the b/g image to it.
Select the second div, name it Body Content or whatever suits, ser 100vw height auto, add all the existing content into this div.
Hopefully by separating the BG from the contents everything should work as desired.
Good luck.
when you say add the b/g image. do you mean open the menu and add a IMAGE button or actually go into the div and scroll down to the b/g slot and add it there?
Depends how you want the image to behave responsively. As a BG image Webflow won’t currently serve up different image sizes for tablet, mobile views (apparently this is coming). I usually add 4 BG images - just press the BG image icon 4 times - and load up your 4 compressed images, turning 3 View off for each breakpoint. This gives me the advantage of staying each breakpoint separately, loading different shaped images to suit the format.
If you want to drag an Image into the div upload a full size image, Webflow will create different sizes and automatically serve up the right size when published. I usual give the image a BG class of BG Image, set 100 % in image settings. Something like this anyway, just play around in image settings to get the breakpoints to work.
ahh I see! good info. One thing that i had to do thought from your instructions, I had to give the 1st div that holds my b/g image a Z of -1. Otherwise the 2nd div with content wouldnt show up. Is that normal?
Yup… its finally working! Thanks again! I deleted the z -1 and its working fine aswell. Odd … the first time i did it, it ddnt want to show the b/g. But its all good now.