Jump to content

Change background opacity on image hover

Recommended Posts

Hi!

Trying to work my way around an issue I'm having. Not a coder but I'm trying to make my background go from 0% opacity to 100% opacity after hovering over an image. (Could theoretically work with a code block aswell as long as I would hide it behind/ontop of my image)

I was trying to customize this one as it has kind of a similar aspect of what I want but instead of it appearing on the pages/sections hover i'd rather it appear on the images hover :
https://insidethesquare.co/squarespace-tutorials/background-hover
 

I attached the link to an example page with the above code activated. So what I'd want is for it to activate on the hover of the title logo. 

Thank you!
 

Link to comment
  • Replies 3
  • Views 1.2k
  • Created
  • Last Reply

Top Posters In This Topic

Popular Days

6 hours ago, terka said:

Is it your website or example website?

If my comments are useful, please like and mark my solution as answer. It will encourage me. Thanks

MD Rofik
Website Designer and Digital Marketer

Am I helpful? Want to offer me a coffee?
Send me a message if needed any help. I'll try to reply as soon as possible.


 

Link to comment
7 hours ago, terka said:

Trying to work my way around an issue I'm having. Not a coder but I'm trying to make my background go from 0% opacity to 100% opacity after hovering over an image. (Could theoretically work with a code block aswell as long as I would hide it behind/ontop of my image)

The page background? The image background? You need to be specific.

7 hours ago, terka said:

I was trying to customize this one as it has kind of a similar aspect of what I want but instead of it appearing on the pages/sections hover i'd rather it appear on the images hover :

I'm going to assume background.

Here's a tutorial:

 

Work With Me 🖥️💻📱

Please remember to tag me so that I get a notification and respond to your help requests.

If my answers have helped you, please drop a like and mark my answer as best to help other users find solutions quickly.

You can also thank me or make requests by buying me a coffee . (Caffeine fuels me to take more requests)

For Squarespace Tips & Tricks, visit @squareskills (Youtube 📺 Tutorials)

For Premium and FREE plugins, visit Squareskills (Plugin Store) 🧩

Some links may be affiliate/referral links.

Link to comment

Create an account or sign in to comment

You need to be a member in order to leave a comment

×
×
  • Create New...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Hire a Designer

Stand out online with the help of an experienced designer or developer.