Disable zoom on front page or mobile site...

Tyche
1

Hi there

Is it possible to disable zoom only on mobile version of theme? If not, I want to disable zoom on front page but not shop page… Please help.

Thank you.

2

Hey there,

I hope you are well today and thank you for your question.

You can try achieving this by adding the following CSS code in the Custom CSS option of your theme on the below path.

Admin Area -> Appearance -> Customize -> Additional CSS

/*disable pointer events on mobile*/
@media (max-width: 550px){
  .tyche-product.primary {
    pointer-events: none;
}
}

Best regards,
Support.

3

Thank you for your interest,

It works on product pages but not work on the 'content widget areas" on the front page. Is there a way to disable zoom on mobile version completely?

4

Hello there,

Please try using this CSS code to catch the mobile zoom instances:

/*disable pointer events on mobile*/
@media (min-width: 400px){
  .tyche-product.primary {
    pointer-events: none;
}
}

Best Regards,
Support

5

Doing this disables all click events, and when clicking on the item name nothing happens (Which means it is impossible for the user to buy it)

6

Instead, do this:

@media (max-width: 550px){
  .tyche-product .tyche-product-image{
    pointer-events: none;
}
}

this will disable click events for the image only, and not the text under it.

7

Hello @izzisolo,

Thanks for adding this update to make the code work more smoothly.
@kamra Please let us know of any other issues.

Best Regards,
Support

8

Hey @izzisolo
Thanks for the solution. Worked like a chime, was searching all over for this solution.

Thanks a lot.

9

Hello there,

@izzisolo Nice work on posting the solution.
Please feel free to contact us again in the future regarding any other issues.

Best Regards,
Support