Changing site background image on button hover on homepage

Site URL: http://www.pellykat.com

Hi!

Looking for some help... I'm trying to achieve what looks relatively simple upon execution, but I'm finding to be tricky to find the right code. I also have no idea what I'm doing and this is my first time trying to use CSS.

Desired outcome looks like this: https://a24films.com upon rollover of text, the background image changes

My site: pellykat.com password: kellypat

Need help with: I'm looking to have the rollover of each homepage button trigger a different background image, so it achieves a similar effect to the a24 reference above, difference being mine are triggered by button hovers.

Would greatly appreciate any help!! Thanks in advance.

Your section background has animate effect so difficult to achieve this, you can consider changing it to static image, we can use code to achieve it easier.

Or you can also use Portfolio Page, it has an option to achieve your example site

or use this approach

Hi! I am definitely open to removing the static effect so I can have the full background image change.

The reference you shared works as well, but would I still be able to achieve similarly with buttons vs. text? Appreciate any and all help, you seem to be an expert on this topic!

On 11/6/2024 at 5:21 AM, Kellyn08 said:

Hi! I am definitely open to removing the static effect so I can have the full background image change.

The reference you shared works as well, but would I still be able to achieve similarly with buttons vs. text? Appreciate any and all help, you seem to be an expert on this topic!

You can use this (update comment)

https://forum.squarespace.com/topic/322330-share-hover-text-%E2%80%93-change-section-image/