Image Rollover Trouble

[scoopsdad]

Hey Guys,

Under the “Ready to Book” section, I’m trying to get a rollover effect in 3 columns following the instructions found here (https://theme.co/apex/forum/t/image-button/19155).

The rollovers work but I’m having trouble and can’t figure out what’s going on:

1. In Cornerstone, I’m no longer able to access both images (default and rollover). Cornerstone acts like there is only 1 image present in each column when there are actually 2.

2. On the front end, the rollover works perfectly in the 1st column but the 2nd and 3rd column’s rollover still shows the default image behind it.

3. Once those two issues are fixed, how do I completely remove the opacity change that happens due to the images being links? I don’t want any opacity or transparency change at all.

Many thanks!

[friech]

Hi @scoopsdad,

Thank you for writing in, 1) Yes, you can not hover the columns on Cornerstone preview, because on that view you can only hover the image. View your page in Skeleton Mode instead to inspect the other image

2. like on that other thread you did not apply the CLASS img-hover to the second and third Column, you only add it to the first column. I did go ahead and corrected this.

3. Please add this to Page > CSS

a.hover-image:hover {
	opacity: 1 !important;
}

Hope it helps,
Cheers!

[scoopsdad]

Wonderful, thank you so much!

[Prasant]

You are most welcome.