2nd image appears on hover + gets Redirected to another page if clicked

This should help:

https://www.tiffany-davidson.com/blog/squarespace-change-image-on-hover with click thru url. 

For anyone, you can use Image Blocks (add link) then use this code to make image change on hover.

Image Block allow you to add link. You can check again.

Have you solved it yet?

On 1/3/2021 at 6:28 PM, tuanphan said:

Image Block allow you to add link. You can check again.

Have you checked this yet?

URL doesn't exist.

https://ptphotography.squarespace.com/projects-with-logo

You want:

• Click Main image > the browser will open new site in same page
• Hover main image > 2rd image will show?

@tuanphan Thank you for your reply. When I hover over main image, I want a second image to show. And if I click on the image, it gets redirected to a link.  Please help me with the code. 

Stay safe,
K

@derricksrandomviews After two weeks of waiting, finally got a functional code! This is wonderful. I didn't know it was that simple! I am so grateful for your assistance and patience. 

Stay safe,
K

thanks @tuanphan 

Suppose we write your code:

But of course, how can I forget that 😆 Bless you!

Sorry @tuanphan I have not figured it out yet. Please help!

22 minutes ago, tuanphan said:

Have you solved it yet?

This was my question I case it gets confusing:

On 1/3/2021 at 3:07 PM, Ptphotography said:

thanks @tuanphan 

Suppose we write your code:

/* hide image on hover */

div#block-yui_3_17_2_1_1577707091631_3805 a:hover img {

opacity: 0;

 

}

div#block-yui_3_17_2_1_1577707091631_3805 a img {

transition: all ease-in-out 0.9s;

opacity: 1;

}

/* Set new image */

div#block-yui_3_17_2_1_1577707091631_3805 a {

background-image: url(https://cylinder-mackerel-pnk5.squarespace.com/s/img1.jpg);

background-size: cover;

display: block;

}

 

Where/How do we rewrite your code in order to get redirected to another page if the image/images is clicked? This is where I am struggling. Basically what we need is a code for a second image to appear on hover and if the image is clicked, it gets redirected to another site/page.

 

Thanks!

 

 

Kind regards,
K

41 minutes ago, tuanphan said:

Have you checked this yet?

Yes sir!