Secondary image on mobile when "touch & hold"

Hi team,

I’d like to implement the functionality to view a secondary imagen on mobile when “touch & hold” on a specific product on the catalog page, on my site (www.sanchissalcedo.com). Please see attached video as an example.

Any help much appreciated!

Best,

Jorge

Hello @Vtt_10 ,

It’s GemPages support team and glad to support you today.

I would like to give you the recommendation to support you so kindly follow the steps below:

  1. Go to Online Store > Theme > Edit code of your current theme

  1. Open your theme.liquid theme file

  2. Paste the below code before

.reveal:hover .hidden {
    z-index: 1;
    opacity: 1;
    background-color: var(--background);
}

If you require any further information, feel free to contact me.

Best regards,
GemPages Support Team

Hi,

Thank you for your answer. I tried but unfortunately did not work, and the code is showing on my site as in the attached screenshot.

Best

Hello @Vtt_10 ,

Sorry about that. Please fix the code a bit like that:


Best regards,
GemPages Support Team

1 Like

This works perfectly! Thank you very much :slightly_smiling_face:

1 Like

Hello @Vtt_10 ,

I am glad that my solution is helpful to you.

Best regards,
GemPages Support Team

HI, i’ve the same question, but for another template.

www.intimosi.com

@GemPages Hello this doesn’t seem to be working, are you able to help me with this?