I did the same thing as this but instead of having a separate hand div animate, I have it placed in my mouse follower div and when it hovers over an element with a specific target, it changes into a mouse follower for that element.
GSAP is great but for this particular case you can avoid downloading it and use linear interpolation one-line function in plain JS Just an example const lerp = (start, stop, amt) => amt * (stop - start) + start;
Ty. I do have an old plain vanilla js tutorial that shows doing something similar. I like to show GSAP because likely in the context of such a project, you'd be utilizing GSAP for other parts of the layout.
Does anyone still use plain html, css and js these days? Would be interesting to see an approach to these kinds of interactions using frontend frameworks and making it reusable throughout the project.
The problem with that is there are a lot of frameworks that people use. Vue, React, Svelte, Angular even. If I show it the vanilla JS way, it should give everyone a solid understanding of how to tackle it.
Big news. A brand new course is in the works, "Advanced Frontends" where we build highly interactive frontends (similar to those found on Awwwards). 😍
Sir you deserve an award for all these Awwwards content. Thank you sir.
Sweet, gimme those awards!
@@DesignCourse Yes Sir I rate you a lot sir
legendary! you deserve all recognition!!
Absolutely amazing
Love this type of videos! very useful
Nice one Gaz.
We need a GSAP crash course.
I do a couple, but I will create an updated crash course here for 2023 shortly.
@@DesignCourse Thanks we will wait for it whenever you are ready with it
@3:10 - Always nice to hear Americans speak German fluently
I did the same thing as this but instead of having a separate hand div animate, I have it placed in my mouse follower div and when it hovers over an element with a specific target, it changes into a mouse follower for that element.
Awesome tutorial. Will love to see a full GSAP tutorial in this channel.
Love your contents. Also can you name the font used in this tutorial??
Bebas Neue
Look nice thanks for sharing!
this not work well when mouse leave , can you fix that sir? i wanna send you bug
GSAP is great but for this particular case you can avoid downloading it and use linear interpolation one-line function in plain JS
Just an example
const lerp = (start, stop, amt) => amt * (stop - start) + start;
Ty. I do have an old plain vanilla js tutorial that shows doing something similar. I like to show GSAP because likely in the context of such a project, you'd be utilizing GSAP for other parts of the layout.
@@DesignCourse unfortunately junior developers often adds huge libraries into the project bundle for a ~1% of its features 😅
Does anyone still use plain html, css and js these days? Would be interesting to see an approach to these kinds of interactions using frontend frameworks and making it reusable throughout the project.
The problem with that is there are a lot of frameworks that people use. Vue, React, Svelte, Angular even. If I show it the vanilla JS way, it should give everyone a solid understanding of how to tackle it.