Jump to content

Different image to appear on hover

Recommended Posts

Hello,

Does anyone know how i would replace a thumbnail image on hover? Each image will replace one of exactly the same dimensions.

I have tried the following:

#projectThumbs a[href="/summer-of-sport/"] img:hover {

background: url("https://images.squarespace-cdn.com/content/v1/5da08b90cec702042e7bd75b/1571842245151-X71IZHOCMO4NWBYCFDQX/ke17ZwdGBToddI8pDm48kBnsafcbTaEy0qOizt2WQ9p7gQa3H78H3Y0txjaiv_0fDoOvxcdMmMKkDsyUqMSsMWxHk725yiiHCCLfrh8O1z4YTzHvnKhyp6Da-NYroOW3ZGjoBKy3azqku80C789l0hKSnD_p9gN_SPga0QCfUjWrQnhO0xA8lZ7BDb1h3OEMwxfqOlkhHMTRjErZ5TgWHQ/Tower+bridge+hover.png");

   background-size: 100% !important;

}

But it seems that the hover image then sits behind the original but I need it in front of it.

Can anyone help?

Thank you

https://greyhound-keyboard-sa3k.squarespace.com/

Link to comment
  • Replies 0
  • Views 226
  • Created
  • Last Reply

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.