Disable Product Image Rollover

Site URL: https://bricktechstudios.com/instructions

Hi! I want to disable the product image rollover that occurs when you move your cursor over the product thumbnail. I know that Squarespace 7.1 doesn't support disabling it yet, but does anyone know some code that can be used to manually disable it?

Thanks!

.products.collection-content-wrapper .grid-item:hover .has-hover-img .grid-image-cover {
    opacity: 1 !important;
}

.products.collection-content-wrapper .grid-item:hover .grid-image-hover {
    opacity: 0 !important;
}

Also, cool site. My son has been looking at it for the past 10 minutes. 🤣

@rwp Thank you, it worked perfectly! 

And thanks, I build Lego Halo stuff on instagram and sell the instructions!

On 7/3/2020 at 3:02 AM, rwp said:

.products.collection-content-wrapper .grid-item:hover .has-hover-img .grid-image-cover {
    opacity: 1 !important;
}

.products.collection-content-wrapper .grid-item:hover .grid-image-hover {
    opacity: 0 !important;
}

Also, cool site. My son has been looking at it for the past 10 minutes. 🤣

Hi! I’m having the same issue but it’s not changing with this CSS?

my site:

tsac.studios.squarespace.com
 

PW: brineintopedro 

26 minutes ago, angeldesign said:

Hi! I’m having the same issue but it’s not changing with this CSS?

 

my site:

tsac.studios.squarespace.com
 

PW: brineintopedro 

Add to Home > Design > Custom CSS

/* Remove image hover */
.ProductList-innerImageWrapper img:first-child {
    opacity: 1 !important;
}
.ProductList-innerImageWrapper img:last-child {
    opacity: 0 !important;
}