Control zoom amount for image hover

Hello Webflow!

I’ve created a zoom hover effect following the awesome tutorial Webflow produced. But the zoom level is way to zoomed in, users will struggle to read the full table/image I’ve placed in. Is there a way to control the zoom level within the code?

Here’s the code pasted into the page:

And here is a link to my webpage: Webflow - SOUTHWORKS | Make Everything Right™

Cheers!


Here is my site Read-Only: LINK
(how to share your site Read-Only link)

Hi @Brendan_Harper

I believe that if you change the “300,300” numbers on line 17 you’ll change the zoom level, although I am not sure, can you share the link to the live website and the link to the tutorial?

1 Like

Thanks @avivtech I changed the numbers down to “100,100” but it seems it only changed the size of the circle and the zoom is still the same.
Here is the live website link: Why us
And the tutorial: Custom image magnification on mouse hover — Webflow tutorial - YouTube

Try adding:

zoomstart: 2;

between lines 13 and 14

from here:
https://www.vali.bg/public/resources/js/plugins/zoomsl/documentation.htm

Is this correct:


At the moment the zoom hover effect has gone when I published the site.

Sorry - “,” instead of the “;”

zoomstart: 2,

No luck unfortunately:

If I change the ‘zoomstart’ number lower would it effect the zoom?

Theoretically
This JavaScript library is not supported anymore and the documentation is in Russian :confused:

Yeah I couldn’t work out the documentation! The lower number didn’t do the trick, thanks for your help @avivtech if you think/find anything else that could help I’d really appreciate it! :slight_smile: