Image Reveal on Hover of Text Link

Can you add Image Blocks under Text Blocks? Then i will check the code to create above effect.

On 7/15/2020 at 3:50 AM, tuanphan said:

Can you add Image Blocks under Text Blocks? Then i will check the code to create above effect.

I can add image blocks next to the text blocks but not under them. I don't know how to do that 😞 . Would adding image blocks next to the text blocks work?

EDIT: I could also do something like this (screenshot), where I add an image block and the caption text over it with "Overlap" . Does that work better?

1 hour ago, k3ats said:

 

I can add image blocks next to the text blocks but not under them. I don't know how to do that 😞 . Would adding image blocks next to the text blocks work?

EDIT: I could also do something like this (screenshot), where I add an image block and the caption text over it with "Overlap" . Does that work better?

Yes, i think it will be better. Try adding & let me know. I will check.

27 minutes ago, tuanphan said:

Yes, i think it will be better. Try adding & let me know. I will check.

Sounds good! They are all added now, thank you!

Add to Home > Design > Custom CSS

.homepage .design-layout-overlap img {
    visibility: hidden;
}
.homepage .design-layout-overlap:hover img {
    visibility: visible;
}

Works perfectly! Thank you!

Hi,

I am trying to do the same thing on my website, but not on the homepage: www.thenewartist.co.uk/the-artists. I want an image to appear on hover across the list of names on this page. How can I adapt this code so it doesn't refer to homepage but to the page I want?

Thanks!!

4 hours ago, _the_new_artist said:

Hi,

I am trying to do the same thing on my website, but not on the homepage: www.thenewartist.co.uk/the-artists. I want an image to appear on hover across the list of names on this page. How can I adapt this code so it doesn't refer to homepage but to the page I want?

Thanks!!

You can portfolio page for this feature

Portfolio Pages – Squarespace Help