kodralex Posted October 28, 2020 Share Posted October 28, 2020 Hi, New to using gsap, very good so far. Just wrapping my head around the functions. I'm currently using tilt.js (little jQuery plugin) to adjust perspective on some elements on hover. It works fine, but i've see a few sites doing the same function using gsap - with better effect (much smoother). I've got an example of what i'm trying to achieve here: https://www.raoul-gaillard.com/work if you move your cursor around you will notice maybe 3 different image elements tilt around. I can see this is being done using gsap. Can anybody point me in the right direction where to start in creating something like this? I'm sure there is a bit of work involved, i'm just unsure where to start (hence why i've not attached a codepen - sorry). Any help will be greatly appreciated. Thanks Link to comment Share on other sites More sharing options...
ZachSaucier Posted October 28, 2020 Share Posted October 28, 2020 Hey kodralex and welcome to the GreenSock forums. Thanks for supporting GreenSock with a Club GreenSock membership! This effect is actually pretty straightforward. You just map the mouse position to some range of values for each element that you want to rotate. In its essence for a single element you can see this post: Same sort of thing with a CSS 3D element: Another one: If you have more specific questions please ask and we'll do our best to help. 1 Link to comment Share on other sites More sharing options...
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment
Create an account
Sign up for a new account in our community. It's easy!
Register a new accountSign in
Already have an account? Sign in here.
Sign In Now