2024-02-23, 04:01 PM
(This post was last modified: 2024-02-23, 08:11 PM by JustAnABDL. Edited 8 times in total.)
TEXT EDITED :
Okay so basically I modified the CSS code of a certain theme that I've seen on reddit and now it's looking like that :
![[Image: 1.png]](https://i.ibb.co/Zd1F0FX/1.png)
And I want that when I scroll down the movie background image and this image
![[Image: mask.png]](https://i.ibb.co/48fxbrV/mask.png)
move in the point of view of the user, but it doesn't.
So I tried to firstly modify the code of the image above (named mask.png) and the problem is the height. It technically works with this for the mask.png but I have to specify a certain height and the height changes for each film, so I search a way that the height is the size of the size of the page when you scroll.
When I put 200% for example it looks like that on this film (so the correct height would be around 210% - 220%) but it changes for each film.
![[Image: 3.png]](https://i.ibb.co/SQ8KccP/3.png)
This is the code :
.layout-desktop .itemBackdrop:after {
background: url("https://i.ibb.co/48fxbrV/mask.png");
background-size: cover;
background-attachment: fixed;
background-repeat: no-repeat;
min-height: 200%;
}
Thanks for responding, I tried what you said but it doesn't work unfortunately :C.
When I try 100vh it's too small and thanks for the typo, I didn't see that before.
Okay so basically I modified the CSS code of a certain theme that I've seen on reddit and now it's looking like that :
And I want that when I scroll down the movie background image and this image
move in the point of view of the user, but it doesn't.
So I tried to firstly modify the code of the image above (named mask.png) and the problem is the height. It technically works with this for the mask.png but I have to specify a certain height and the height changes for each film, so I search a way that the height is the size of the size of the page when you scroll.
When I put 200% for example it looks like that on this film (so the correct height would be around 210% - 220%) but it changes for each film.
This is the code :
.layout-desktop .itemBackdrop:after {
background: url("https://i.ibb.co/48fxbrV/mask.png");
background-size: cover;
background-attachment: fixed;
background-repeat: no-repeat;
min-height: 200%;
}
Thanks for responding, I tried what you said but it doesn't work unfortunately :C.
When I try 100vh it's too small and thanks for the typo, I didn't see that before.