Streaming live at 10am (PST)

Magnify-on-Hover Interaction - Not Working

Hi there,

I’ve attempted to implement Magnify-on-Hover functionality, to the product images on the eCommerce section of my website. Following the tutorial detailed in this Youtube video: Custom image magnification on mouse hover — Webflow tutorial - YouTube

Unfortunately, the magnifier (although working) does not align with the point on the image you’re hovering over, see link > IM© Bleed Texture Pack - IDLEMYND©

The only difference between my build and what’s detailed in the tutorial video, is that I added Magnify as a combo class, and as a result - my code looks a little different… Under plugin initialization I have inserted .product_image_main as opposed to just .magnify.

Code Template: https://image-magnification-code-snippet.webflow.io

Your assistance would be very much appreciated.


Here is my site Read-Only:
https://preview.webflow.com/preview/idlemynd?utm_medium=preview_link&utm_source=designer&utm_content=idlemynd&preview=1542f8fdac7b5deb0be2326ea11a1607&pageId=60aa3f04c13b966cba37993e&itemId=60ae37088a997095f82476a5&workflow=preview

1 Like

I have the same issue