Hover distortion on CMS portfolio images

I am using Robin Delaport’s hover effect. WebGL Distortion Hover Effects | Codrops

Is there a way to use this as a hover effect for a CMS portfolio collection? Where I can input the same CMS image as image1 and image2. I tried putting a HTML embed of the script within the collection list and added the image fields to the script:

When I publish it you can see one of the images with the effect when I move the mouse, but it isn’t positioned correctly. Here is a video

Does anyone know what I might be doing wrong?

Here is a read only link to the page that I am trying to use it on.

Published page