Site logo

Archived topic

Parallax for header block problem

5 replies · Started by Alexander on April 13, 2021

Viewing posts 1–6 of 6

Hi! Thanks for the parallax script discussed in
https://generatepress.com/forums/topic/parallax-effect-using-generatepress-theme-and-generateblocks/

I've tried to apply it to the page header made with GenerateBlocks via a hook. I have some text on the page followed by gallery images. When scrolled down, the text goes up under the Hero block making it impossible to read while the images flow over the Hero block. Why do they split and is it really possible to make all the content go over the parallax header?

Hi there,

Any chance you can link us to the site?

Also, did you add the CSS mentioned in that topic?

Let us know :)

Yes, I've added the CSS. Please find the access below as the site is under construction.

Ah, it seems that this particular parallax script requires a wrapper.

So you would:

1. Add a Container, give it a class of parallax-wrapper.

2. Add your Container with the background image inside of it, give it a class of parallax.

3. Add the javascript.

4. Add this CSS:

.parallax-wrapper {
    overflow-y: hidden;
}

Thank you for your help, Tom! It works OK.

No problem :)

This archived topic is closed to new replies.