Enable a second image to appear on mobile product cards

Store Design
, , , , ,
1

Hello,
How can I enable a second image to appear on mobile product cards?

I have already tested all these codes mentioned in this link, but I was not successful.

It is important to highlight that it is working normally on the computer, I would like to add the same functionality when swiping the image on mobile.

Captura de tela 2024-09-22 145216.png
Captura de tela 2024-09-22 145216.png352×279 51.1 KB

My Theme: Impact

2

Hello @LUNAMIS

Can you please your store url and password (if applied) ?

so i can check and fine what’s the issue and suggest you the best solution

3

Hi @LUNAMIS ,

Please go to Actions > Edit code > Assets > theme.css file and paste this at the bottom of the file:

.product-card--show-secondary-media .product-card__figure:hover .product-card__image--primary {
        opacity: 0;
    }
    .product-card--show-secondary-media .product-card__figure:hover .product-card__image--secondary {
        opacity: 1;
        display: block;
    }