jQuery Zoom Script Not Working

[toad78]

I’m trying to use this script on this page. Following the instructions on the script’s page, the zoom function doesn’t seem to be working. I should be able to see a ‘zoom’ of the image on the left and the image on the right while hovering my mouse over it. But nothing seems to be happening.

Using Chrome Developer Tools, there are a couple of errors that have caught my eye:

Uncaught TypeError: $(…).zoom is not a function
(anonymous function) @ menu.html:157
c.extend.ready @ jquery.min.js:26
L @ jquery.min.js:33

Not sure what that means.

<script>

        $(function(){

            $('#ex1').zoom();

            $('#ex2').zoom();

        });

    </script>

So if zoom is not a function, how do I get it to work?

[tevko]

is jQuery loaded before or after that code?

[RyanReese]

TBH you don’t even need jQuery to zoom images. Just use CSS. Something like transform:scale(2) (example). Maybe combine it with a transition to make it jQuery-esk.

[toad78]

RyanReese, I’ve tried CSS but it doesn’t seem to work with FF 38. It works with Chrome, without issue.

When I run tests, it seems unstable and ‘snaps’ back to it’s original scale. I need something to control the zoom and location of the cursor.

Going back to the ‘zoom’ script I’m trying to use, Chrome still claims there’s an issue with my script (attachment available)

I’m not rightly sure why the error because I’m using the exact code from the demo I downloaded (also attached) and Chrome does not detect ANY errors from it.

So what’s triggering the error?