Zoom on mouse over (hover) in product page - Brooklyn 2018

Highlighted
Shopify Partner
5 0 0

How do I implement what I have just stated on the title.

- I need it on our product pages where it should zoom whenever the mouse cursor hovers over the product picture.

- And should work as stated even after switching variant selections.

 

Please help us.

Store PW: BetaCustomer

 

#ConglomerateMan
0 Likes
Highlighted
Shopify Partner
53 0 0

If you're happy to pay for it, the best solution is to install Magic Zoom Plus. The user experience is more invigorating than the default zoom tool and Magic Zoom Plus has a powerful full-screen view on click.

The app also supports switching images with product variants.

https://apps.shopify.com/magic-zoom-plus

It's the highest rated product image app on Shopify. We're the creators. Our team provides free support to configure the app if it doesn't work immediately on your store.

Gorgeous image apps for Shopify - zoom, enlarge, magnify, spin, slideshow.
0 Likes
Highlighted
New Member
2 0 1

and what if I'm not happy to pay for it? it seems that JQuery Zoom is already in the Brooklyn theme..

Probably you ve also found this famous zoom tutorial: https://easycodeguide.com/add-zooming-function-shopify-theme.html

but I'm stuck with pasting script (point 5). if I do it in theme.liquid and then /head/ section - it doesn't work :/  I would make a guess that it is colliding with the scrolling function a few lines above:

 

code.JPG

 

... so if anyone knows - speak up please! 

1 Like