Jump to content

How to drop a shadow underneath my image on my home page when hover over?

Recommended Posts

Hi all

I am trying to drop a #E2E558 shadow underneath my image on my home page when hover over.

My site www.kacy-jung.com

 

Attached images the former is a reference look to explain what I am trying to achieve, and the later is my site. 

Could somebody help me out how to achieve it?

Many thanks!

Screen Shot 1740-10-09 at 09.24.18.png

Screen Shot 1740-10-09 at 09.34.07.png

Edited by Kacy-Jung
Link to comment
  • Kacy-Jung changed the title to How to drop a shadow underneath my image on my home page when hover over?

@Kacy-Jung Hi! Try adding this code under Website > Pages > Website Tools > Custom CSS

.homepage .image-block:hover {
    filter: drop-shadow(2px 2px 15px #E2E558);
    transition: filter 0.3s ease-in-out;
}

 

If my comments were useful, please like or mark my solution as answer so others can scroll to it quickly. 

Sam
Web Developer & Digital Designer

 Did you find my contribution helpful? Buy me a coffee?

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.