Parallax image scroll (or lack of)

I Need Help
1

Hi,

I apologise if this has been covered elsewhere (a quick search didn’t bring up a thread relating to my specific issue) and also if the answer is ‘obvious’; I’m new to Blocs.

I have added parallax to the banner section of a site I’m ‘remaking’ in blocs and the background image doesn’t scroll at all; not the way I understand the effect should be. I previously built the site with Webacappella and the parallax effect is quite different. The background image scrolls considerably. You can see it here: www.zu-yoga.ch

All that happens with the Blocs version is the text (and next section) scroll up over the background. The image itself remains static, except for a slight flicker which, I presume, is the image trying to scroll, but hitting the top margin. Can anybody recommend how (or if it’s at all possible) to remedy this. My background image is 2400 x1600, padding is set to ‘full screen’ and style is ‘fill’.

Many thanks.

2

Parallax isn’t a “fixed style” There can be many variations of it. The built in Parallax in Blocs has a fixed image.

In fact the style the class applies is background-attachment:fixed;

1 Like
3

Can ‘background-attachment:fixed;’ be changed to background-attachment:scroll;?

4

That will just create just a static image that moves with the page - eg no parallax effect. I haven’t looked into it, but at a guess, the effect you are after requires some javascript.

5

OK, thanks.

6

If you are feeling ambitious this is very cool, and runs well on mobile.

The demo is here

https://marrio-h.github.io/universal-parallax/demo/

1 Like
7

Thanks, I’ll take a look.