Jump to content

I need help writing a code to get specific images to hover

Recommended Posts

Posted

I'm looking to create an opacity hover effect on images that will include a click through link.

I want to do it for every image on a specific page. It is not a gallery, but I want each image to have the same effect.

The specific page is www.austenjohnson.com/videography

I want all of the images under my portfolio to make it clear that they are links to videos, I don't want people to think they are still images.

 

THANK YOU 

  • Replies 1
  • Views 1.2k
  • Created
  • Last Reply

Top Posters In This Topic

Popular Days

Top Posters In This Topic

Posted Images

Posted

I've found an article that guides you on adding an overlay on image hover. Check it out here: https://support.squarespace.com/hc/en-us/articles/205826048-Creating-hover-effects-for-your-images

OR 

Achieving an overlay hover effect can be done with CSS code.
 

div#block-yui_3_17_2_1_1696487530512_47089 {
   opacity:0 !important;
   transition: opacity 1s;
}
div#block-yui_3_17_2_1_1696487530512_47089:hover {
   opacity:1 !important;
   transition: opacity 1s;
}

 

Hover on Image.gif

Widle - Squarespace Website Design Experts

email.png
Connect - Connect with Email 
website.png
Website - Visit us
address.png
Ahmedabad, India
 
 
 
 

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.