Hi! I want the product cards to show their second image on hover, I have checked the option and it works on desktop, but it doesn’t work on mobile… I need it to work on mobile too. Any help please? Here’s the store https://agori-jewellery.com/ I’m using Dawn 7.0.1

Hi @agori May I suggest to update code these steps: Go to Store Online-> theme → edit code Assets/component-card.css Add code below to bottom of file .card-wrapper:hover .media.media--hover-effect>img:first-child:not(:only-child) { opacity: 0; } .card-wrapper:hover .media.media--hover-effect>…

Hi! What I mean is that now, if I scroll down, nothing happens unless I touch the card images. And if I touch them briefly, the product landing page will open up. In order for the second photos to show on the product card, I need to touch and hold/slide for a moment, and someone who’s not aware of …

Hi, May you try to code below for Dawn theme: Go to Store Online-> theme → edit code Assets/base.css Add code below to end of file body .card-wrapper .media.media--hover-effect:hover>img+img, body .card-wrapper:focus .media.media--hover-effect>img+img, body .card-wrapper:hover .media.media--hove…

Hi again! Thanks a lot for the option, but we tried it and it still works the same way than before. The second photos don’t show up unless we tap and slide on each one of them. If there’s anything else we can try, we’d be absolutely thankful. Our website is laregueira.shop Thanks again for everyt…

Hi, Did you add code above to your theme? I checked your site but I didn’t see any code that has been added. I checked this file. https://laregueira.shop/cdn/shop/t/14/assets/base.css?v=117828829876360325261702319193

Hi EBOOST, I’ve been looking for the answer to this everywhere. Could you please help me out? I am using the Pipeline theme and our url is shop.jackknifemotors.com

Hi, Because this is an theme that is not free. So I can’t help to check. So I only can suggest for you code below: Go to Store Online-> theme → edit code Layout/theme.liquid Add code below to end of file and before tag [EBOOST_0-1703056958287.png]

Hello, I need again your help. When the client click on the picture, he can see the second picture. However, if he wants to buy it, it does work if he clicks on the picture again. He needs to click the price or description. He can we fix that please. Once again, this is on the mobile only. On …

Hi again, Ok, that worked, but there are just a couple of minor issues. First, when you let go, it stays on the second image instead of switching back to the first like on desktop. The second issue is, if you hold your finger on the product for more than a second it highlights the image, instead of…

Hello I’m using impact theme version 4.3.4 and I want to implement this mobile hover image transition I’ve tried most of solutions above but they did not work can you provide any tips for me https://www.boujisphere.com/ this is my website link

Hi, May I suggest to update code these steps: Go to Store Online-> theme → edit code [EBOOST_0-1703652894866.png] Assets/theme.css Add code below to end of file body .product-card--show-secondary-media .product-card__figure:hover .product-card__image--primary { opacity: 0; } body .produ…

How can I enable second image hover on mobile product cards?

Store Design

EBOOST December 20, 2023, 7:24am 79

Hi,

Because this is an theme that is not free. So I can’t help to check. So I only can suggest for you code below:

Go to Store Online-> theme → edit code
Layout/theme.liquid
Add code below to end of file and before tag

Topic		Replies	Views
Show second image on hover ( DAWN Theme ) Store Design	16	223	June 23, 2023
Reveal second image on hover - Debut theme Store Design	134	1649	November 9, 2023
Product card second image on hover/touch for mobile Store Design design	2	59	January 18, 2025
Collection - Add a hover effect to product images on your collection pages Store Design	87	1868	February 27, 2024
Image on hover on product card not be second image Store Design design , customizations , css , shopify-themes , troubleshooting	22	246	July 29, 2025

How can I enable second image hover on mobile product cards?

Related topics