Jump to content

CSS HOVER ON MASONRY COVER IMAGES MATSUYA

Recommended Posts

Site URL: https://green-teal-cz6t.squarespace.com/config/design/custom-css

Hey there,

I'm using the masonry design for my homepage running on Matsuya. I'm fairly competent with the rest of what I'd like to do but one thing that's really grinding my gears is trying to make the images hover when they are rolled over.

 

Because I quite like the no spacing between the images (and even if there was space) I think it'd be quite functional to show it will click through if the image shrinks, goes monochrome, enlarges or loses opacity....you know what I mean...?

 

Is there a simple few lines of css I can drop in to make this work? I notice there is a small disclaimer saying it might not be possible...but I'd like to circumnavigate that. Surely there must be a way?

Attached in an example of my feeble attempts...basically I would like the wall to become interactive. I can make it click through to pages, but to animate a hover over would be ideal. Also attached some hypothetical illustrations of what I'm trying to achieve.

 

Thanks in advance.

Screenshot 2020-07-13 at 17.43.51.png

Screenshot 2020-07-13 at 18.22.57.png

Screenshot 2020-07-13 at 18.26.12.png

Link to comment
  • Replies 3
  • Views 246
  • Created
  • Last Reply
12 hours ago, rwp said:

Your page needs to be set up with a password so we can see it

Ah, thanks. Ok. I believe I have just done that...though when I go to save SS seems to automatically revert the password to an unknown and much longer one than what I am typing.

FWIW I changed the password to hoverhelp2020. Give that a go if you have some time. In the meantime I shall have another look.

🙂

Link to comment

Archived

This topic is now archived and is closed to further replies.

×
×
  • 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.