Topic: Hover layer on the start page

Tom
July 25, 2024 at 8:22 am

Hi guys,

is there a function within the theme where I can activate the hovering (opacity) of certain featured images,for example only for the home-/startpage?
Ying
July 25, 2024 at 8:55 am

Hi there,

No, there isn’t a built-in function in GP. GP is a theme, it’s for global settings, and it does not control individual blocks.

However, you should be able to use CSS code to achieve this.
Tom
July 25, 2024 at 9:09 am

Hi Ying,

thanks a lot! Can you please provide an example code? It would take ages to figure it out on my own 🙁
Alvind
July 26, 2024 at 12:27 am

Hi there,

Could you provide the link to the page where you want this to be applied?
Tom
July 26, 2024 at 2:29 am

Hi Alvind,

I would like to apply that on all featured images on the same page you are already helping me out.

explorertom.com/17324-2/
David
July 26, 2024 at 4:52 am

Hi there,

is it just the featured images in the query loops ?
Tom
July 26, 2024 at 5:26 am

The query loops as well as all the others I inserted manually as grid pics.
David
July 26, 2024 at 5:57 am
Ok.

1, add this CSS to your site:
```
.image-hover-effect img:hover {
    opacity: 0.8;
    transition: opacity 0.3s;
}
```
2. select an Image Block and in Advanced > Additional CSS Classes add:

image-hover-effect
Tom
July 26, 2024 at 8:59 am

That is working! Thanks again!
David
July 27, 2024 at 2:04 am

Glad to hear that!

Viewing 10 posts - 1 through 10 (of 10 total)

Hover layer on the start page