Canvas Image Gallery with mousemove zoom and parallax
Hi there,
I'm curious about how to achieve an effect similar to this: https://www.davidwilliambaum.com/
I know they used the canvas element. And I found forum threads/codepens where parts of the effect are achieved without canvas.
Parallax: https://greensock.com/forums/topic/17320-background-parallax-effect-on-mouse-move/
Mousemove:
Is there a GSAP plugin for the zoom effect of the images which depends on the mouse position?
Thank
Hey DenFin and welcome to the GreenSock forums!
No, nothing that specific. But GSAP can animate the properties for you most definitely
How this is likely done:
Layout a bunch of images scaled down in a <canvas>
Calculate the distance from the mouse to the center of each image.
If that distance is within a certain range, scale up (towards its intrinsic size) that image based on the distance to it.
Determine which image is the closes
