How can I adjust the size and add a parallax effect to my website's background image?

Technical Q&A
1

Hi,

I’ve managed to change the background image of my site but i’m looking to change the size of image and add a parallax effect to the background image so that it slightly scrolls with the flow of the page.

this is the code ive added so far to change the image:

body {
background: url(https://cdn.shopify.com/s/files/1/0113/4044/7844/t/7/assets/bananas.png);
background-attachment: fixed;
}

can anyone help?

2

Hi @Chris-McGuire ,

you are facing this issue, it would be my pleasure to help you.
Welcome to the Shopify community!
Please Share your store live url with password (if it password protected) where you want to do modification, so that I will solve your issue here!

3

www.clubhousehq.co.uk

4 
body#clubhouse-shop {
    background-image: url(https://cdn.shopify.com/s/files/1/0113/4044/7844/t/7/assets/bananas.png);
    background-attachment: fixed;
}

Add this css at the bottom of
Online Store->Theme->Edit code->Assets->theme.scss.liquid